源码网,源码论坛,源码之家,商业源码,游戏源码下载,discuz插件,棋牌源码下载,精品源码论坛

 找回密码
 立即注册
楼主: ttx9n

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

[复制链接]

7万

主题

861

回帖

32万

积分

论坛元老

Rank: 8Rank: 8

积分
329525
发表于 2018-9-5 11:11:54 | 显示全部楼层 |阅读模式
今天小编就为大家分享一篇js jquery 获取某一元素到浏览器顶端的距离实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

如下所示:

<!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 获取某一元素到浏览器顶端的距离实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

回复

使用道具 举报

3

主题

2万

回帖

156

积分

注册会员

Rank: 2

积分
156
发表于 2022-10-22 21:52:23 | 显示全部楼层
撒房产税陈飞飞
回复 支持 反对

使用道具 举报

2

主题

2万

回帖

146

积分

注册会员

Rank: 2

积分
146
发表于 2022-12-31 20:53:48 | 显示全部楼层
了乐趣了去了去了去了去了
回复 支持 反对

使用道具 举报

29

主题

2万

回帖

194

积分

注册会员

Rank: 2

积分
194
发表于 2023-1-22 22:39:58 | 显示全部楼层
哟哟哟哟哟以偶
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

68

积分

注册会员

Rank: 2

积分
68
发表于 2023-2-21 22:30:29 | 显示全部楼层
hi哦回复iOS就看见
回复 支持 反对

使用道具 举报

15

主题

2万

回帖

122

积分

注册会员

Rank: 2

积分
122
发表于 2023-6-6 14:08:31 | 显示全部楼层
dfdsafdsfdsfdsf
回复 支持 反对

使用道具 举报

6

主题

2万

回帖

425

积分

中级会员

Rank: 3Rank: 3

积分
425
发表于 2023-6-16 00:51:20 | 显示全部楼层
的沙发水电费水电费
回复 支持 反对

使用道具 举报

2

主题

2万

回帖

69

积分

注册会员

Rank: 2

积分
69
发表于 2023-8-26 18:11:36 | 显示全部楼层
很不错的源码论坛
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2023-9-2 15:52:26 | 显示全部楼层
可以,看卡巴
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

319

积分

中级会员

Rank: 3Rank: 3

积分
319
发表于 2023-9-9 00:19:37 | 显示全部楼层
老衲笑纳了
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies

本版积分规则

手机版|小黑屋|网站地图|源码论坛 ( 海外版 )

GMT+8, 2025-2-8 12:52 , Processed in 0.097220 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表