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

来源：动视网责编：小采时间：2020-11-27 22:08:20

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

js jquery 获取某一元素到浏览器顶端的距离实现方法:如下所示： <!doctype html> <html lang=en> <head> <meta charset=UTF-8> <style> body{ margin: 0; padding: 0; } .mdiv{ width: 100px; height: 100px; ba

推荐度：

点击下载本文 文档为doc格式

导读js jquery 获取某一元素到浏览器顶端的距离实现方法:如下所示： <!doctype html> <html lang=en> <head> <meta charset=UTF-8> <style> body{ margin: 0; padding: 0; } .mdiv{ width: 100px; height: 100px; ba

如下所示：

<!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>

以上这篇js jquery 获取某一元素到浏览器顶端的距离实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

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

推荐度：

点击下载本文 文档为doc格式

标签：元素 js 顶端

热门焦点

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

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

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

最新推荐

猜你喜欢

热门推荐