首页 > Web开发 > 详细

jquery实现高度的获取-位置函数

时间:2017-02-22 18:14:06      阅读:191      评论:0      收藏:0      [点我收藏+]

一.位置函数

 

1.offset()
获取匹配元素在当前视口的相对偏移。返回的对象包含两个整形属性:top 和 left。此方法只对可见元素有效。
2.innerWidth()
获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效。返回值:整型数据
3.innerHeight()
获取第一个匹配元素内部区域高度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效。返回值:整型数据
4.outerWidth()
 获取第一个匹配元素外部宽度(默认包括补白和边框)。此方法对可见和隐藏元素均有效。返回值:整型数据
5.outerHeight()
获取第一个匹配元素外部高度(默认包括补白和边框)。此方法对可见和隐藏元素均有效。返回值:整型数据
6.scrollTop()
获取匹配元素相对滚动条顶部的偏移。
7.scrollLeft()
获取匹配元素相对滚动条左侧的偏移

 

二..参考: js取高度

网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth 

 

jQuery:

$(document).ready(function(){
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin

alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的宽度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin
})

加一个参考图:

技术分享

jquery实现高度的获取-位置函数

原文:http://www.cnblogs.com/Alex80/p/6430040.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!