获取滚动条的滚动距离

最新推荐文章于 2024-04-22 14:53:24 发布
最新推荐文章于 2024-04-22 14:53:24 发布
阅读量1.5k 收藏
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Jonn1124/article/details/118481979
版权 
function getSCrollOffset() {
	if(window.pageXOffset){
		return {
			x: window.pageXOffset,
			y:window.pageYOffset
		}
	} else {
		rentun {
			x:document.body.scrollLeft + document.documentElement.scrollLeft,
			y:document.bod.scrollTop + document.documentElement.scrollTop
		}
	}
}
newbie (⊙o⊙)
关注
专栏目录
获得滚动条的滚动距离
liuhao9999的博客
05-30 1049
function getScrollOffset() { if (window.pageXOffset) { return { x: window.pageXOffset, y: window.pageYOffset } } else { return { x: document.body.scrollLeft + document.documentElement.scr.
JS获取滚动条到底部得距离
YingUser的博客
05-28 1653
// 监听滚动 FirstPage 是父组件传过来的值 判断调用哪个的 addEvent() { window.addEventListener( 'scroll', this.type == 'FirstPage' ? this.firstPageScrollEvent : this.scrollDomScrollEvent ); }, // 滚动出首页则展示 firstPageScrollEvent(..
随手记：树结构翻页和定位指定数据逻辑
最新发布
weixin_63515766的博客
04-22 631
树结构翻页和定位指定数据逻辑
获取滚动条的距离
weixin_34197488的博客
11-15 676
<script type="text/javascript"> $(document).ready(function() { $(window).scroll(function() { //$(document).scrollTop() 获取垂直滚动的距离 ...
JS获取页面滚动距离
qq_40147756的博客
06-30 4203
获取或设置一个元素的内容垂直滚动的像素数。返回文档在垂直方向已滚动的像素值。
利用js获取滚动条滚动距离，实现图片固定在屏幕的某个位置
热门推荐
weixin_43885123的博客
12-01 1万+
利用js获取滚动条滚动距离，实现图片固定在屏幕的某个位置 思路： 1.获取对象距离顶部和左侧的距离； 2.获取元素对象； 3.当滚动条滚动时获取滚动条滚动的距离； 4.滚动条滚动时执行函数：对象距离顶部 / 左侧的距离变为原本距离顶部 / 左侧的距离+滚动条滚动像素数。 html代码： &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&
js获取浏览器滚动条距离顶端的距离
备忘录之胡言乱语
03-14 1410
最近在做项目的时候遇到需要用js获取滚动条距离窗口顶端的距离和js获取浏览器可视化窗口的大小，在这儿做一个整理保存：    一、jQuery获取的相关方法 jquery 获取滚动条高度 获取浏览器显示区域的高度 ： $(window).height(); 获取浏览器显示区域的宽度 ： $(window).width(); 获取页面的文档高度 ： $(documen...
获取滚动条滚动距离
06-02
获取滚动条滚动距离可以使用JavaScript中的`scrollTop`属性。例如，如果要获取垂直滚动条的滚动距离，可以使用以下代码： ```javascript var scrollTopDistance = document.documentElement.scrollTop || document....
js获取滚动距离的方法
10-24
在介绍JavaScript获取滚动距离的方法时，首先要了解的是页面滚动条的机制和页面布局相关的一些基本概念。在Web开发中，页面的滚动一般指的是当页面内容超出了视窗（视图区域）的大小时，用户可以使用滚动条来查看未...
jquery判断滚动条距离顶部的距离方法
10-18
总结一下，jQuery提供了`$(window).scroll()`和`$(window).scrollTop()`等方法，帮助开发者轻松获取和利用滚动条的位置信息。在实际应用中，可以根据需求调整阈值和动画效果，实现更丰富的用户交互。对于前端开发者...
javascript 实现滚动条滚动到一定距离时显示层
02-23
javascript 实现滚动条滚动到一定距离时显示层 可以兼容全部浏览器。
C#利用API判断滚动条的位置
05-20
很简陋的一个测试程序，点击button打开API，拖动滚动条到最下方出现提示信息。
js获取滚动条的距离
m0_64337756的博客
01-09 6323
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
获取滚动头部和左边距离
weixin_42500793的博客
08-04 440
function scroll(){ if(window.pageYOffset !== null){ return { top:window.pageYOffset, left:window.pageXOffset } } else if(document.compatMode === "CSS1Compat"){ return { top:document....
滚动条滑动距离
wgf1997的博客
09-10 801
let element = document.getElementById("Id") console.log("纵向" + element.scrollTop + "px") console.log("横向" + element.scrollLeft + "px")
获取滚动条距离浏览器顶部和左边的距离（滚动的距离）
蜗牛的博客
04-03 3157
<body> <div style="height: 2000px;width:2000px"></div> <script> function getScroll() { if (window.pageXOffset) { return {//主流浏览器 ie...
js获取浏览器滚动条垂直滚动距离scrollTop的兼容方法
kmd6174的博客
06-16 2514
window.onscroll = function(){ //谷歌下始终为0 火狐与IE8正常 var dst = document.documentElement.scrollTop; //谷歌下正常 火狐与IE8始终为0 var bst = document.body.scrollTop; console.log('document.documentElement.scr
获取滚动条滑动的距离
dg981214的博客
07-10 1183
/** * @description 获取滚动条滑动的距离 * document.documentElement.scrollTop | document.body.scrollTop * document.documentElement.scrollLeft | document.body.scrollLeft * IE8 和 IE8 以下的浏览器不兼容 * ...
滚动距离、可视窗口大小的获取以及兼容模式写法
weixin_43933771的博客
07-16 517
获取滚动距离的兼容模式写法 常规方法： （1）window.pageXOffset/pageYOffset （注意：IE8及以下是不支持的） （2）document.body.scrollLeft/scrollTop （注意：IE8及以下是支持的） （3）document.documentElement.scrollLeft/scrollTop （注意：IE8及以下是支持的） （4）window.scrollX/scrollY 兼容模式的封装写法： <script> //我们还是在这
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值