js jquery 获取某一元素到浏览器顶端的距离

最新推荐文章于 2023-09-04 15:09:39 发布

根子的数据库

最新推荐文章于 2023-09-04 15:09:39 发布

阅读量2.5w

点赞数 1

分类专栏： js 文章标签： jquery javascript 浏览器

本文链接：https://blog.csdn.net/genziisme/article/details/72636761

版权

js 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

 
 <!doctype html> 
 
 <html lang= 
 "en" 
 > 
 
 <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 class= 
 "banner" 
 ></div> 
 
 <script src= 
 "jquery.js" 
 ></script>  
 //自行下载 
 
 <script> 
 
 //原生 
 
     //获取div距离顶部的距离 
 
 var  
 mTop = document.getElementsByClassName( 
 'banner' 
 )[0].offsetTop; 
 
 //减去滚动条的高度 
 
 var  
 sTop = document.body.scrollTop; 
 
 var  
 result = mTop - sTop; 
 
 console.log(result); 
 
 //Jquery 
 
 mTop = $( 
 '.banner' 
 )[0].offsetTop; 
 
 sTop = $(window).scrollTop(); 
 
 result = mTop - sTop; 
 
 console.log(result); 
 
 </script> 
 
 </body>