jquery css处理,包括CSS,位置,尺寸等

一:CSS

使用 说明 例子
css(name|pro|[,val|fn]) 访问匹配元素的样式属性
$("p").css("color");
$("p").css("color","red");

二:位置

使用 说明 例子

获取匹配元素在当前视口的相对偏移

回的对象包含两个整型属性:top 和 left,以像素计

$("p:last").offset({ top: 10, left: 30 });

offset().left 指定标签在html中的坐标
offset().top 指定标签在html中的坐标

 

获取匹配元素相对父元素的偏移

返回的对象包含两个整型属性:top 和 left

 指定标签相对父标签(relative)标签的坐标
获取匹配元素相对滚动条顶部的偏移
var p = $("p:first");
$("p:last").text( "scrollTop:" + p.scrollTop() );

$(window).scrollTop() 获取
$(window).scrollTop(0) 设置

 获取匹配元素相对滚动条左侧的偏移

var p = $("p:first");
$("p:last").text( "scrollLeft:" + p.scrollLeft() );
$("div.demo").scrollLeft(300);

三:尺寸

  • 使用
说明 例子
取得匹配元素当前计算的高度值(px)
$("p").height();
$("p").height(20);
 取得第一个匹配元素当前计算的宽度值(px)

$("p").width();
$("p").width(20);

获取第一个匹配元素内部区域高度

(包括补白、不包括边框)

var p = $("p:first");
$("p:last").text( "innerHeight:" + p.innerHeight() );
 获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。

var p = $("p:first");
$("p:last").text( "innerWidth:" + p.innerWidth() );

获取第一个匹配元素外部高度(默认包括补白和边框)

设置为 true 时,计算边距在内

 

获取第一个匹配元素外部宽度(默认包括补白和边框)

设置为 true 时,计算边距在内

 

jquery-css处理的更多相关文章

  1. js,jquery,css,html5特效

    包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...

  2. jquery css事件编程 尺寸设置

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jquery css事件编程 位置 操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. jQuery & CSS 制作金属质感的选择按钮

    如果能把 CSS 运用好,我们创作出好的交互和效果的可能性大大增加.这篇文章中,我想与大家分享一组结合 jQuery & CSS 制作的充满金属质感的选择框效果,绝对是超级精美的效果. 在线演 ...

  5. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  6. 复习练习(03)jquery Css方法一步步升级

    jquery Css方法一步步升级 <script src="jquery-1.8.3.js"></script> <script type=&quo ...

  7. jQuery CSS 的操作函数

    jQuery CSS 操作函数 下面列出的这些方法设置或返回元素的 CSS 相关属性. CSS 属性 描述 css() 设置或返回匹配元素的样式属性. height() 设置或返回匹配元素的高度. o ...

  8. Jquery+css实现图片无缝滚动轮播

    Today,在XX学院的教学视频中,偶尔看到了Jquery+css实现图片无缝滚动轮播视频教程,虽然以前已写过类似的,但是我感觉他学的比较精简.为了方便以后做项目时直接拷贝,特地写出来,顺便和大家分享 ...

  9. jQuery css,position,offset,scrollTop,scrollLeft用法

    jQuery css,position,offset,scrollTop,scrollLeft用法: <%@ page language="java" import=&quo ...

  10. 【源码分享】jquery+css实现侧边导航栏

    jquery+css实现侧边导航栏 最近做项目的时候,突然想用一个侧边导航栏,网上找了几个插件,有的太丑而且不太符合我的预期.与其修改别人的代码,不如自己来写一个了.废话不多说先上图,感兴趣的请继续看 ...

随机推荐

  1. Jira 添加自定义字段

    打开添加自定义字段,并选择字段类型 填写名称,并创建 3.选择关联的界面,并更新

  2. Linux 使用NC命令永久监听本地端口

    感谢: 冰点阳光 Linux可以使用nc命令来测试网络端口是否正常,类似于telnet命令,但也可以用nc命令来监听本地端口,支持TCP.UDP协议,当我们测试NTP服务网络策略是否正常时,可以使用到 ...

  3. 【大数据】Spark内核解析

    1. Spark 内核概述 Spark内核泛指Spark的核心运行机制,包括Spark核心组件的运行机制.Spark任务调度机制.Spark内存管理机制.Spark核心功能的运行原理等,熟练掌握Spa ...

  4. Java学习之基本数据类型和引用数据类型区别

    JAVA中分为基本数据类型和引用数据类型区别一.基本数据类型: byte:Java中最小的数据类型,在内存中占8位(bit),即1个字节,取值范围-128~127,默认值0 short:短整型,在内存 ...

  5. Day23-Model操作和Form操作-转载

    参考出处: http://blog.csdn.net/fgf00/article/details/54614706 Model和Form以及ModelForm简介 Model操作: 创建数据库表结构 ...

  6. NOI2018旅游记

    这居然是我第一次参加非NOIP的NOI系列赛事,有点小期待啊 前几天的UNR我暴露出了许多问题,而且翻了好多分,不过令人震惊的是假设Day1不停电(导致已经写好的T3没交上去)我居然有rk10,虽然并 ...

  7. 【转】如何应用Query语句进行规则的语法设置?

    在Altium Designer中, 设计规则通常用来定义用户的设计需求. 这些规则涵盖了设计的方方面面, 从布线宽度, 对象的安全间距,内电层的连接风格, 过孔风格等等. 设计规则不仅能在PCB设计 ...

  8. php编程——验证码的实现(session方法)

    index.PHP(实现输入验证码页面)代码如下: <html><head><title>check code</title></head> ...

  9. Java基础-反射(reflect)技术详解

    Java基础-反射(reflect)技术详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.类加载器 1>.JVM 类加载机制  如下图所示,JVM类加载机制分为五个部分 ...

  10. Java与groovy混编 —— 一种兼顾接口清晰和实现敏捷的开发方式

    有大量平均水平左右的"工人"可被选择.参与进来 -- 这意味着好招人 有成熟的.大量的程序库可供选择 -- 这意味着大多数项目都是既有程序库的拼装,标准化程度高而定制化场景少 开发 ...