关于onScroll事件在IE6下每次滚动触发三次

最新推荐文章于 2021-06-09 12:02:49 发布
最新推荐文章于 2021-06-09 12:02:49 发布
阅读量75 收藏
点赞数
原文链接：http://www.cnblogs.com/rym1020/articles/2181398.html
版权

今天测试发现IE6下用window.onscroll，每次滚动时会触发3次，而火狐、IE7没此问题，应该是IE6的一个BUG

这里有一个人和我一样的情况

http://topic.csdn.net/t/20020826/11/970138.html

但帖子内有人测试又没问题，我测试的IE6是windows 2003下的，不知道XP下的是否已修复该问题。

在微软官方找到一篇关于IE5存在此BUG的帮助文档。

http://support.microsoft.com/kb/238004/zh-cn

解决办法是用一个全局变量来限制触发的3次事件只执行一次，200ms后再将该变量复位即可。

 

这个问题比较罕见，特此记录一下

转载于:https://www.cnblogs.com/rym1020/articles/2181398.html

weixin_30456039
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
关于onScroll事件在IE6下每次滚动触发三次bug说明
12-08
这里有一个人和我一样的情况 http://topic.csdn.net/t/20020826/11/970138.html 但帖子内有人测试又没问题，我测试的IE6是windows 2003下的，不知道XP下的是否已修复该问题。 在微软官方找到一篇关于IE5存在此BUG的帮助文档。 http://support.microsoft.com/kb/238004/zh-cn 解决办法是用一个全局变量来限制触发的3次事件只执行一次，200ms后再将该变量复位即可。 这个问题比较罕见，特此记录一下
JavaScript触发onScroll事件的函数节流详解
10-20
的内容是说说最近在工作中遇到过的常见的问题。主要是关于JavaScript触发onScroll事件的函数节流，文中由一个常见的问题开始展开，一步步的介绍解决的方法，有需要的朋友们下面来跟着小编一起看看吧。
html判断滚动条位置,通过scrollTop()判断滚动条到指定位置执行动画，代码执行很多次怎么办？...
weixin_42391485的博客
06-09 617
1.通过scrollTop()判断滚动条到指定位置执行动画，代码执行很多次怎么办？点击查看DEMO，请用浏览器模拟手机查看效果，console.log有打印执行次数。现在的问题是我每次滚动他就执行一次，然后往回滚也会一直执行，一直判断scrollTop()，这样肯定会很卡，所以来请教大神们怎么解决。HTML代码如下：testJS代码如下：var nummmm = 0;$(document).rea...
在IE、FF、Chrome下滚动条的onscroll事件
chicaohun7473的博客
11-16 150
有时在页面上，需要Fixed（css里的position属性）的效果，用JS实现的话，在如题的三个平台可以这样写： window.onscroll = _onScroll; function _onScroll(){ var labeller_layer = documen...
js判断iframe内的网页是否滚动到底部触发事件
10-23
onscroll事件会在用户滚动内容窗口时触发。在事件处理函数中，可以通过比较scrollTop、clientHeight和scrollHeight来确定是否滚动到底部。 scrollHeight属性是元素内容的总高度，包括因为溢出而不可见的部分。通过...
js实现顶部固定，摆脱ie的抖动
道路是曲折的，前途是光明的
07-25 1657
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> * {margin: 0;padding: 0} body {height: 2000px} #inner {width: 100%
js的window.onscroll事件兼容各大浏览器！
php研究院新手营
11-27 9256
为窗口添加滚动条事件其实非常的简单，     window.onscroll=function(){};     注意在获取滚动条距离的时候     谷歌不识别document.documentElement.scrollTop，必须要加上document.body.scrollTop；即     var scrolltop=document.documentElement
weixin011医院核酸检测服务系统开发+Springboot.zip
08-23
互联网发展至今，无论是其理论还是技术都已经成熟，而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播，搭配信息管理工具可以很好地为人们提供服务。针对医院核酸检测信息管理混乱，出错率高，信息安全性差，劳动强度大，费时费力等问题，采用医院核酸检测服务系统可以有效管理，使信息管理能够更加科学和规范。 医院核酸检测服务系统在Eclipse环境中，使用Java语言进行编码，使用Mysql创建数据表保存本系统产生的数据。系统可以提供信息显示和相应服务，其管理员管理医护人员和普通管理员，管理检测进度和接种进度，审核检测订单和接种订单。普通管理员负责管理疫苗接种和核酸检测信息的管理，审核接种订单和检测订单。 总之，医院核酸检测服务系统集中管理信息，有着保密性强，效率高，存储空间大，成本低等诸多优点。它可以降低信息管理成本，实现信息管理计算机化。
weixin206校园顺路代送微信小程序ssm.zip
最新发布
08-23
现代经济快节奏发展以及不断完善升级的信息化技术，让传统数据信息的管理升级为软件存储，归纳，集中处理数据信息的管理方式。本校园顺路代送微信小程序就是在这样的大环境下诞生，其可以帮助管理者在短时间内处理完毕庞大的数据信息，使用这种软件工具可以帮助管理人员提高事务处理效率，达到事半功倍的效果。此校园顺路代送微信小程序利用当下成熟完善的SSM框架，使用跨平台的可开发大型商业网站的Java语言，以及最受欢迎的RDBMS应用软件之一的MySQL数据库进行程序开发。校园顺路代送微信小程序管理员有个人中心，用户管理，发布者管理，代送类型管理，代送任务管理，任务接取管理，任务取消管理，系统消息管理，意见反馈，系统管理。发布者和用户都可以注册登录，发布者主要发布代送任务和任务取消操作，用户可以选择接受发布者的任务，并且可以反馈。校园顺路代送微信小程序的开发根据操作人员需要设计的界面简洁美观，在功能模块布局上跟同类型网站保持一致，程序在实现基本要求功能时，也为数据信息面临的安全问题提供了一些实用的解决方案。可以说该程序在帮助管理者高效率地处理工作事务的同时，也实现了数据信息的整体化，规范化与自动化。
美世2024年全球人才趋势–亚洲篇.pdf
08-23
【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚洲篇.pdf【美世】2024年全球人才趋势–亚
最新工作总结报告PPT模板 (2).pptx
08-23
年终总结 新年计划 述职报告 工作汇报 医疗报告 员工转正 季度报告 适用人群：学习不同技术领域的小白或进阶学习者；可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。
weixin163基于微信小程序的校园二手交易平台系统设计与开发ssm.zip
08-23
社会发展日新月异，用计算机应用实现数据管理功能已经算是很完善的了，但是随着移动互联网的到来，处理信息不再受制于地理位置的限制，处理信息及时高效，备受人们的喜爱。所以各大互联网厂商都瞄准移动互联网这个潮流进行各大布局，经过多年的大浪淘沙，各种移动操作系统的不断面世，而目前市场占有率最高的就是微信小程序，本次开发一套微信小程序的校园二手物品交易平台，有管理员和学生两个角色。管理员可以在后台管理个人中心，学生管理，商品分类管理，商品信息管理，购买信息管理，出售信息管理，交流论坛，系统管理。学生可以注册登录，发布和购买商品，还可以收藏商品和在交流论坛发帖。微信小程序的校园二手物品交易平台服务端用Java开发的网站后台，接收并且处理微信小程序端传入的json数据，数据库用到了MySQL数据库作为数据的存储。这样就让用户用着方便快捷，都通过同一个后台进行业务处理，而后台又可以根据并发量做好部署，用硬件和软件进行协作，满足于数据的交互式处理，让用户的数据存储更安全，得到数据更方便。
A_LITE_BERT_FOR_SELF-SUPERVISED_LEARNING_OF_LANGUA_albert_zh.zip
08-23
A_LITE_BERT_FOR_SELF-SUPERVISED_LEARNING_OF_LANGUA_albert_zh
班组长及班组管理.docx
08-23
班组长及班组管理.docx
社科院2024中国护肤品消费趋势报告.pdf
08-23
【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告.pdf【社科院】2024中国护肤品消费趋势报告
vue3 nuxt3环境下，滚动条触发css动画
05-30
在Vue3中，你可以使用`v-scroll`指令来监听滚动事件。而在Nuxt3中，你可以在组件的生命周期钩子函数`mounted`中使用`$refs`来获取DOM元素。因此，你可以在组件中使用以下代码来实现滚动条触发CSS动画： ```html <template> <div class="container" v-scroll="onScroll"> <div class="content" ref="content"> <!-- Content Here --> </div> </div> </template> <script> export default { methods: { onScroll() { const content = this.$refs.content; const contentTop = content.getBoundingClientRect().top; const windowHeight = window.innerHeight; if (contentTop < windowHeight) { content.classList.add('animate'); } else { content.classList.remove('animate'); } } } } </script> <style> .content { transition: transform 0.5s ease-in-out; } .animate { transform: translateY(50px); } </style> ``` 在这个例子中，我们使用了`v-scroll`指令来监听滚动事件。当滚动事件被触发时，`onScroll`方法会被调用。在该方法中，我们使用`$refs`来获取`.content`的DOM元素，并使用`getBoundingClientRect()`方法获取该元素的位置信息。然后，我们将窗口的高度与`.content`元素的位置信息进行比较。如果`.content`元素的顶部位置小于窗口高度，则添加`animate`类名，否则移除`animate`类名。在CSS中，我们使用`transition`属性来定义过渡效果，使用`transform`属性来定义动画效果。 请注意，该方法只是一个简单的示例，你可以根据自己的需求调整代码。也可以使用第三方库如`vue-scrollama`来实现更复杂的滚动动画效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值