滾動鼠標滑輪，每次向下滾動要輸出好多1，怎么確保不管滾多遠都只輸出一個1$(document).on("mousewheel DOMMouseScroll", function (e) { ??????? var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || ??????????????????? (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1));??????? if (delta<0) {??????????? console.log("1");? ??????? }else{????????????console.log("2");???????? }??? });
3 回答
已采納
stone310
TA貢獻361條經驗 獲得超191個贊
??var?a=0;??????//本次的getTime()
??var?b=0;??????//上一次的getTime()
??var?flag=5;???//設定一個判斷變量，保證在條件下console.log只執行一次
$(document).on("mousewheel?DOMMouseScroll",?function?(e)?{
????b=a;???????//b賦值為上一次的getTime()
????a=new?Date().getTime();???//a賦值為本次的getTime()
????var?delta?=?(e.originalEvent.wheelDelta?&&?(e.originalEvent.wheelDelta?>?0??1??:?-1))?||
??????????????(e.originalEvent.detail?&&?(e.originalEvent.detail?>?0??-1?:?1));
????if(a-b<=300){?????//如果兩次getTime()差距在300ms以內，可以視作在連續滾動
????????if(delta<0?&&?delta!=flag){????//保證delta只執行一次，連續滾動中第二次滾動，delta==flag，即不成立
????????????console.log("1")
????????????flag=delta???????????????
????????}else?if(delta>0?&&?delta!=flag){
????????????console.log("2")
????????????flag=delta
????????};
????}else{???????????????????//非連續滾動下，即getTimer差距300以上
????????if(delta<0){
????????????console.log("1")
????????flag=delta????????????????????????//防止等待時間過長出現2次
????????}else{
????????????console.log("2")
?????????flag=delta
????????};
????};
});你看下是不是這種效果，這里寫的意思是，當鼠標滾軸連續滾動時（每次滾動間隔300ms以內），只顯示1次console.log，如果鼠標慢慢滾動（每次滾動間隔300以上），則每次滾動都顯示console.log，300這個數可以改
-
艷妮子Yeah對對，這個時間差把我的問題解決了，非常感謝，我已經苦惱兩天了，大神，請收下我的膝蓋 -
艷妮子Yeahvar k=1; var Height=document.body.clientHeight; var time1=0; var time2=0; $(document).on("mousewheel DOMMouseScroll", function (e) { time2=time1; time1=new Date().getTime(); //a賦值為本次的getTime() var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1)); if (time1-time2>=300&&$(window).scrollTop()<Height&&delta<0&&k==1) { $("html,body").animate({scrollTop:Height},1000); console.log(a-b); k=0; }else if($(window).scrollTop()<=Height&&delta<0){ k=1; } }); 大神，求救，我想用這種方式實現當整個網頁處于第一屏時，滾動鼠標網頁整屏滾動，其余正常?？墒乾F在滾動鼠標時mousewhile控制頁面滾動速度，不是animate。在谷歌瀏覽器上比較明顯。
-
stone310var Height = document.documentElement.clientHeight||document.body.clientHeight; 這里做個兼容
-
艷妮子Yeah您好，我現在還有一個疑問，因為滾動鼠標的程度影響觸發mousewhile的次數，怎樣做到從滾動鼠標到停止滾動只觸發一次mousewhile呢,不知道我解釋清楚了沒
-
黑女2008你這需求有問題吧，代碼怎么知道你總共需要滾動幾次，你是滾動一次就不滾動了還是滾動100次不滾動啊，除非你確定總的滾動次數。你想啊，你都不知道要滾動多少次，怎么讓程序在最后滾動才觸發？？程序怎么知道你是最后一次滾動呢？
-
艷妮子Yeah可能是我沒解釋清楚，我想設計一個滾屏的效果，當頁面scrolltop=0的時候滾動鼠標頁面滾動一屏?？墒敲看挝覞L動鼠標就會觸發很多mousewhile事件，出現閃屏的現象。
點擊展開后面2條
- 3 回答
- 0 關注
- 2744 瀏覽
添加回答
舉報
0/150
提交
取消