jQuery css详解

今天确确实实是放了一天假，喝了点小酒，看了天天向上和快乐大本营以及中国好舞蹈，越来越热爱舞蹈了，还是总结一篇吧。

@jquery css

css(name|pro|[,val|fn)：访问或设置匹配元素的样式属性

1 $("div").click(function(){
2     $(this).css({width:20px,height:30px})
3 });

offset([coordinates]):获取匹配元素在当前视口(body)的相对偏移

1 <p>hello baby</p>
2
3 $("p").html("left:"+offset.left+",top:"+offset.top);
4
5 // offset().left就相当于与body的Margin-left
6 //offset().top就相当于与body的Margin-top

position():获取或设置匹配元素相对父元素的偏移

1 $("p").html("left:"+$("p").position().left);
2
3 //position().left相当于与当前父元素的Margin-left;
4 //position().top相当于与当前父元素的Margin-top;

scrollTop([val]):获取匹配元素相对于滚动条顶部的偏移；

scrollLeft([val]):获取匹配元素相对于滚动条左部的偏移;

height(val|fn):取得或设置匹配元素当前计算的高度值（高度）

1 $("p").height(20);

width(val|fn):取得或设置匹配元素当前计算的宽度值(宽度);

innerHeight():获取第一个匹配元素内部区域高度(高度+补白)

innerWidth():获取第一个匹配元素内部区域宽度;

outerHeight([options]):获取第一个匹配元素外部高度；

1 <p>HELLObaby</p>
2
3 $("p").html("outerHeight:"+$("p").outerHeight()+",outerHeight(true):"+$("p").outerHeight(true));
4
5 //outerHeight() 表示高度+补白+边框，当参数为true时，表示高度+补白+边框+边距;

outerWidth([options]):获取第一个匹配元素的外部宽度；

总结还不够精炼，还需要逐步完善！！

转载于:https://www.cnblogs.com/eyeSpace/p/3790219.html

jQuery css详解相关推荐

jQuery动画详解
jQuery动画详解 css样式 button {display: block;margin: 0 auto 20px;}div {width: 100px;height: 100px;backgro ...
[CSS]详解display:inline | block |inline-block的区别
2019独角兽企业重金招聘Python工程师标准>>> [CSS]详解display:inline | block |inline-block的区别[点评网站][发布新闻][申请专栏 ...
Asp.Net+Jquery.Ajax详解5-$.getScript
目录(已经更新的文章会有连接,从7月25日开始,每2到3天更新一篇): Asp.Net+Jquery.Ajax详解1-开篇(2012.07.25发) Asp.Net+Jquery.Ajax详解2-$. ...
视频教程-javascript/jquery全过程详解-Java
javascript/jquery全过程详解资深大数据.java讲师,十年开发经验,曾经任职于北大青鸟.讯腾软件等多家知名教育机构,精通javaweb, 前端技术,J2EE技术体系,熟练使用Spri ...
css详解background八大属性及其含义
background(背景) 以前笔者在css盒模型以及如何计算盒子的宽度一文中提到过盒模型可以看成由元素外边距(margin).元素边框(border).元素内边距(padding)和元素内容(c ...
犀利开发 jQuery内核详解与实践pdf
下载地址:网盘下载犀利开发 jQuery内核详解与实践循序渐进地讲解了jQuery高效开发的方法和技巧,内容包括jQuery框架的设计模式和思路.Sizzle选择器的构成和工作机制.DOM文档操作. ...
JavaWeb = jQuery使用详解
jQuery 是一个优秀的 javascript 的轻量级框架之一,封装了 dom 操作.事件.页面动画.异步操作等功能. 特别值得一提的是基于 jquery 的插件非常丰富,大多数前端业务场景都有其 ...
J2EE学习篇之--JQuery技术详解
前面我们讲解了的J2EE的技术都是服务端的技术,下面我们来看一下前端的一些开发技术,这一篇我们来看一下jQuery技术简介: jQuery由美国人John Resig创建,至今已吸引了来自世界各地的 ...
jQuery.show()详解
jquery的show/hide/toggle详解转载自[jquery的show/hide/toggle详解](https://www.cnblogs.com/gongshunkai/p/59301 ...

jQuery css详解

jQuery css详解相关推荐

最新文章

热门文章