var getrepeate = 0;function handle(delta) { var date1 = new Date(); if(date1.getTime() - getrepeate < 200){ return; } var date = new Date(); getrepeate = date.getTime(); var s = delta + ": "; var setpositiononscroll = 0; if (delta <0){ setpositiononscroll = setPositionForPage(true); }else{ setpositiononscroll = setPositionForPage(false); } if(document.compatMode != "CSS1Compat"){ document.body.scrollTop = setpositiononscroll; }else{ if(document.documentElement.scrollTop == 0){ document.body.scrollTop = setpositiononscroll; console.log(setpositiononscroll + " " + document.body.scrollTop); }else{ document.documentElement.scrollTop = setpositiononscroll; } } } function wheel(event){ var delta = 0; if (!event) event = window.event; if (event.wheelDelta) { delta = event.wheelDelta/120; if (window.opera) delta = -delta; } else if (event.detail) { delta = -event.detail/3; } if (delta) setTimeout(function(){handle(delta);},250);}//监听鼠标滚轮事件function setPageScroll(){ if (window.addEventListener){window.addEventListener('DOMMouseScroll', wheel, false);} window.onmousewheel = document.onmousewheel = wheel; } 上面是代码,实际上已经实现出来了,但是效果感觉不好。这里面最上面的是全局变量,判断鼠标的滚轮滚动时间间隔,根据如果间隔太小return;我遇到的问题是: 鼠标滚轮滚动会导致页面位置发生变化,我监听鼠标滚动触发事件是为了调整页面的卷入高度,比如:鼠标滚轮向上滚动了一次,我让网页的卷入高度 scrollTop设置为1500px; 但实际上触发事件之后浏览器将页面的卷入高度设置为了1500px;而后鼠标向上滑动则让页面的卷入高度再次发生变化,如果消除这种变化的影响。我的解决办法是setTimeout 通过setTimeout间隔一定时间再调用事件,让页面的卷入高度设置为1500px;相当于等滚动滚动对于页面的影响完成之后再调用函数。 不过效果很有限,因为设置时间短没效果,时间长就被人给当作网页卡死了。该如何解决?
添加回答
举报
0/150
提交
取消