jquery定位

摘要:
$.height();可视窗口的高度$.scrollTop();滚动条滚动的距离当滚动条滚到最低端时:$.height()==$.height()+$.scrollTop();当网页高度小于浏览器窗口时:$.height()返回的是$.height();假如要获取整个文档的高度,不建议用$.height()、$.height()的高度,原因:$.height():body可能会有边框,获取的高度会比$.height()小;$.height():在不同的浏览器上获取的高度的意义会有差异,说白了就是浏览器不兼容。

1、$("div").offset().left ; div到文档的左距离(offset() 方法返回或设置匹配元素相对于文档的偏移)
$("div").offset().top; div到文档顶端的距离
$("div").offset().top-$(window).scrollTop; div到可视窗口顶端的距离(用总的距离-滚动的距离可得到)

2、$("div").position().left; 把div转化成类似定位的形式,即把自身的margin去掉,再计算自己到有定位的父级的距离,如果父级都
没有定位,则是计算div到文档的距离,top同理。

3、$("div").width() ; div的宽度(不包括内外边距和边框)
$("div").innerWidth(); div的宽度加上padding
$("div").outerWidth(); div的宽度加上padding+border
$("div").outerWidth(true); div的宽度加上padding+border+margin

4、$(document).height() ; 整个文档的高度,宽度同理。
$(window).height(); 可视窗口的高度
$(window).scrollTop(); 滚动条滚动的距离(即滚动条顶端到文档顶端的距离)
当滚动条滚到最低端时:$("document").height()==$(window).height()+$(window).scrollTop();
当网页高度小于浏览器窗口时:$(document).height()返回的是$(window).height();
假如要获取整个文档的高度,不建议用$("html").height()、$("body").height()的高度,原因:$("body").height():body可能会有边框
,获取的高度会比$(document).height()小; $("html").height():在不同的浏览器上获取的高度的意义会有差异,说白了就是浏览器
不兼容。

$(window).scrollTop(); ==$(document).scrollTop()==$("html").scrollTop(); 但是$(window).scrollTop()可被所有的浏览器支持,
其它则不行。

5、事件对象:event
ev.pageX 相对于文档的横坐标
ev.pageY 相对于文档的纵坐标
ev.which==ev.keyCode 获取键值
ev.preventDefault(); 阻止默认事件
ev.stopPropagation(); 阻止冒泡
return false; 既阻止默认事件 又阻止冒泡

免责声明:文章转载自《jquery定位》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇gensim学习笔记wpf mvvm datagrid DataGridTemplateColumn的绑定无效的可能原因之一!下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

jQuery .tmpl(), .template()学习资料小结

昨晚无意中发现一个有趣的jQuery插件.tmpl(),其文档在这里。官方解释对该插件的说明:将匹配的第一个元素作为模板,render指定的数据,签名如下: .tmpl([data,][options]) 其中参数data的用途很明显:用于render的数据,可以是任意js类型,包括数组和对象。options一般情况下都是选项了,官方指出,此处的optio...

npm下载某个版本

如果我想要引入的是Jquery的1.7.2版本,则输入npm intall jquery@1.7.2,那么npm包管理器就会帮助你下载jquery1.7.2的版本到你当前操作目录下的node_modules下了,就是这么简单:) 使用npm info jquery  这种方式和第一种类似,也可以查看jquery所有的版本, npm ls jquery 即可...

省市区三级联动jquery插件 city-picker与百度地图API联动小案例

city-picker  插件是开源中国一个很好用的三级联动菜单 单独使用city-picker : <body> <div id="r-result"> 请输入:<input type="text" size="20" /> </body> <script type="...

jQuery实现星级评分

前面有一篇原生js实现星级评分 。可能覆盖面不是很广,现在给出一个jquery实现的星级评分。 Html代码    <div class="star">   <span>jQuery星级评论打分</span>   <ul>   <li><a href="javascript:;...

jQuery中json对象的复制(数组及对象) .

1、jQuery自带的$.map方式: $.map(json, function (n) { return n; }); 这种方式原来用于复制数组还可以,今天用它复制数组中的某一条记录,发现字段名称丢失了,后来发现了第二种方法。 2、深复制与浅复制 // 浅层复制(只复制顶层的非 object 元素) var newObject = jQuery.ext...

jQuery同步Ajax带来的UI线程阻塞问题及解决办法

俗话说不作死就不会死,今天作死了一回,写了一个比较二逼的函数,遇到了同步Ajax引起的UI线程阻塞问题,在此记录一下。   事情起因是这样的,因为页面上有多个相似的异步请求动作,本着提高代码可重用性的原则,我封装了一个名为getData的函数,它接收不同参数,只负责获取数据,然后把数据return。基本的逻辑剥离出来是这样的: function get...