页面元素距离浏览器工作区顶端的距离 = 元素距离文档顶端偏移值 - 网页被卷起来的高度
即：
页面元素距离浏览器工作区顶端的距离 = DOM元素对象offsetTop -documentdocumentElementscrollTop
介绍几个属性：（暂时只测了IE和firefox，实际上工作中用到的最多的是chrome）
网页被卷起来的高度/宽度（即浏览器滚动条滚动后隐藏的页面内容高度）
(javascript) documentdocumentElementscrollTop //firefox
(javascript) documentdocumentElementscrollLeft //firefox
(javascript) documentbodyscrollTop //IE
(javascript) documentbodyscrollLeft //IE
(jqurey) $(window)scrollTop()
(jqurey) $(window)scrollLeft()
网页工作区域的高度和宽度
(javascript) documentdocumentElementclientHeight// IE firefox
(jqurey) $(window)height()
元素距离文档顶端和左边的偏移值
(javascript) DOM元素对象offsetTop //IE firefox
(javascript) DOM元素对象offsetLeft //IE firefox
(jqurey) jq对象offset()top
(jqurey) jq对象offset()left
js中获取某个元素到浏览器最左和最右的距离的程序代码是：
<!doctype html><html><head><meta charset="UTF-8"><style>
body{margin: 0;padding: 0;}
mdiv{width: 100px;height: 100px;background-color: red;}
</style></head><body><div style="height: 1000px"></div><div></div><script src="jqueryjs"></script> //自行下载<script>//原生//获取div距离顶部的距离
var mTop = documentgetElementsByClassName('banner')[0]offsetTop;
//减去滚动条的高度var sTop = documentbodyscrollTop;var result = mTop - sTop;consolelog(result);//Jquery
mTop = $('banner')[0]offsetTop;
sTop = $(window)scrollTop();
result = mTop - sTop;
consolelog(result);
</script></body>
if(documentdocumentElement&&documentdocumentElementscrollTop)
{
scrollTop=documentdocumentElementscrollTop;
}
else if(documentbody)
{
scrollTop=documentbodyscrollTop;
}
if(scrollTop>50)
{
documentgetElementById('obj')styleopacity='0';
}
以上就是关于如何获取元素距离页面顶部的高度全部的内容，包括:如何获取元素距离页面顶部的高度、js中如何获取某个元素到浏览器最左和最右的距离、js获取滚动条距离浏览器顶部高度高度，改变导航css等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）