$(window).scroll()无法触发滚动条事件的问题

最新推荐文章于 2024-06-07 14:24:16 发布
最新推荐文章于 2024-06-07 14:24:16 发布
阅读量1.5k 收藏
点赞数
分类专栏： 小技巧 文章标签： javascript jquery css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43493613/article/details/117257990
版权

滚动条事件很常见。但有的时候竟会无法触发这个事件，或者第一次触发随后不触发！

首先我们看，$(window).scroll()，是window的滚动，window代表的是当前窗口,但是如果我们把html和body设置了

width：100%；height：100%；

则无法$（window）.scroll的滚动条事件。

还有它的父标签也不能高度限制！

yywxp886
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
判断滚动条滑到底部触发事件(实例讲解)
01-19
$[removed](scroll, function () { //真实内容的高度 var pageHeight = Math.max(document.body.scrollHeight, document.body.offsetHeight); //视窗的高度 var viewportHeight = window.innerHeight || ...
js操作滚动条事件实例
10-24
JavaScript操作滚动条事件是网页动态效果中常见的技术，它允许开发者根据用户滚动页面的行为执行相应的功能。本实例主要探讨了如何使用JavaScript监听和处理滚动条事件，以及在实际应用中的技巧和注意事项。 首先，...
$(window).scroll()触发失效
在希
08-11 2858
标题$(window).scroll()触发失效 最近遇到一个问题，在项目中写了$(“window”).scroll()方法，但是在滚动页面的时候发现此方法没有触发，后来查找原因才发现是因为页面中的html或者body元素设置了overflow:auto样式才无法出发 解决方式：在页面结构布局完整的情况下将改样式去掉。 关于window.scroll系列方法汇总 & 滚动到指定元素位置 1.window.scroll() 概述 滚动窗口至文档中的特定位置。 语法 window.scroll(x-co
$(window).scroll()滚动
Dustin
02-01 620
$(window).scroll(function () {                 var newtop = $(this).scrollTop();                 $("#MemberMenu").animate({ "top": newtop },{duration:600,queue:false});             }); 红色部分加上以
scroll-view中@scroll事件滚动未触发之一系列问题
最新发布
weixin_58390720的博客
06-07 380
问题：在页面上滑后，再想下滑至顶部时发现触发了下拉刷新，且页面不能向下滑动解决方法：使用scroll监听滑动位置，当到达顶部时下拉即触发刷新。
解决方案：$(window).scroll无效问题。
孤芳不自赏
03-04 8400
问题 $(window).scroll无效问题。 原因 如果你的css中：html,body的高度样式如果设置为100%，那么$(window).scroll方法将检测不到正确的滚出高度（0），导致滚动监听事件失效。 解决办法 <style> html,body{height:auto} </style> ...
$(window).scroll() 实现 网页头部导航滚动显隐
沐枫
04-11 1516
jQuery.ajax()函数用于通过后台HTTP请求加载远程数据。 jQuery.ajax()函数是jQuery封装的AJAX技术实现，通过该函数，我们无需刷新当前页面即可获取远程服务器上的数据。 jQuery.ajax()函数是jQuery的底层AJAX实现。jQuery.get()、jQuery.post()、load()、jQuery.getJSON()、jQuery.g
vue中监听scroll事件失效的问题及解决。
weixin_47404583的博客
09-23 1023
因为我写的div 只是window内部的一个小元素，所以，需要向下捕获才可以。vue中监听scroll事件失效的问题及解决。无法监听到滚动的事件，不打印console。vue 监听scroll 事件也不生效。对于这个问题解释一下这三个参数吧。
vue使用@scroll监听滚动事件时，@scroll无效问题的解决方法详解
12-13
在网上看了一下vue中监听滚动条滚动事件，清一色的使用document.addEventListener('scroll',function(){}) 我是在做滚动条滑到底部时，自动加载更多的时候有这个需求。 我认为使用document.addEventListener会破坏...
javaScript实现滚动条事件详解
10-19
JavaScript 滚动条事件是网页开发中常用的一种交互方式，它允许开发者在用户滚动页面时执行特定的函数。在本篇文章中，我们将深入探讨如何使用 JavaScript 来监听和处理滚动条事件，以及如何通过这些事件来改变页面...
html，小程序scroll-view去除滚动条
01-08
子盒子添加内容溢出滚动条显示属性 overflow-y:scroll 并设置好宽高 可实现隐藏滚动条也可是滚轮触发滑动，使用此方法 无法监听window的滚动条事件。 代码示例： .box{ width:300px; height: 400px; overflow: ...
$(window).scroll(function() { })； window的滚动事件不触发以及offset().top数据乱的原因？
AAAXiaoApple的博客
10-13 1508
$(window).scroll(function() { }); window的滚动事件不触发以及offset().top数据乱的原因？ 如果你的css中：html,body的高度样式如果设置为100%，那么$(window).scroll方法将检测不到正确的滚出高度（0），导致滚动监听事件失效。 $(window).scroll() 方法不能触发 这个是我在项目中遇到**,$(window).scroll()**当我在使用这个事件方法的时候竟然不能响应,很是郁闷,后来才发现是css样式影响到了,废话少说
scroll事件失效问题
kingdomwar的博客
02-21 527
scroll事件触发条件
$(window).scrollTop()和$(document).scrollTop()区别
骆小胖~
08-24 4789
对浏览器窗口的滚动条，两者在ie下有兼容性，       jQuery中，$(document).scrollTop()与 $(window).scrollTop()效果完全相同       但是，$(window).scrollTop()被所有浏览器支持所以，以后尽量用$(window).scrollTop()
$(window).scroll() 方法不能触发
热门推荐
u011784205的专栏
07-30 1万+
这个是我在项目中遇到,$(window).scroll()当我在使用这个事件方法的时候竟然不能响应,很是郁闷,后来才发现是css样式影响到了,废话少说,直接上代码 这个是我在js中使用的 $(window).scroll(function (event) { console.log(event); }) 下面是我修改之前的css样式: body { text-a
js中window.scroll与window.onmousewheel区别
u014798510的博客
09-14 4367
1、使用window.scroll必须要有滚动条才能触发，一般配合$(window).scrollTop()使用. 2、window.onmousewheel,document.onmousewheel无论有没有滚动条都能触发 一般的兼容性写法:// 滚动注册事件 if(document.addEventListener{ document.addEventListener('DOMMo
window.scroll
杰克拉乌的博客
05-11 1298
今天调响应式。为了不出横向滚动条设置一个属性overflow-x:hidden;结果window.scroll事件失效了。当你去掉html上的overflow属性就会生效。
if (clientHeight + scrollTop + 1 >= scrollHeight) { // 如果数据量超过30就停止继续加载 console.log('滚动条触底了'); console.log(this.$store.getters.getStoreCount); console.log(this.$store.getters.getStoreCount >= 30); if (this.$store.getters.getStoreCount >= 30) { window.removeEventListener('scroll', scrollTo); console.log('-------------------'); console.log('执行了移除加载事件'); } else { // 一秒后执行 const loading = this.$loading({ lock: true, text: 'Loading', }); setTimeout(() => { this.load(); loading.close(); }, 1000); } }
06-13
这是一段 JavaScript 代码，它的作用是监听页面滚动事件，当滚动条滑到页面底部时触发加载更多数据的操作。其中，`clientHeight`表示浏览器窗口的可见区域高度，`scrollTop`表示当前文档滚动条滚动的距离，`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值