求大神指點js修改margintop導致無限下滑的問題
問題描述
事情的經過是這樣的:。。。。
我做了個網頁,網頁的下半部分需要在加載后等待3秒鐘自動上移,所以我用了Jquery的 animate方法:
$("#part2").animate({marginTop: "-=800px"}, 8000);
燃鵝,用了這個方法之后,結果鼠標滾輪又沒辦法把它搞下來了。
于是,我用了一段js代碼,監聽滾輪動作,如果有滾輪動作,就修改 margintop屬性,使得這個part2層,可以跟隨滾輪上下滑動。。
最后我發現,功能是實現了,但是這個part2的margin-top屬性可以無限增加,導致part2有時候會下到無限遠的下方,這個時候就懵逼了。
$(document).on('mousewheel DOMMouseScroll', onMouseScroll); function onMouseScroll(e) {e.preventDefault();var wheel = e.originalEvent.wheelDelta || -e.originalEvent.detail;var delta = Math.max(-1, Math.min(1, wheel));var part2= document.getElementById('part2');if (delta < 0) {//向下滾動 console.log('向下滾動'); part2.style.marginTop =( parseInt(part2.style.marginTop) - delta*20 ) + "px";} else {//向上滾動 console.log('向上滾動'); part2.style.marginTop =( parseInt(part2.style.marginTop) + delta*20 ) + "px";} }
請問我該如何解決這個問題? 我知道你們都懂,我小白! 在此感謝!
問題解答
回答1:http://yl5p76q.cn/ 公西雁凡資訊網 帥
相關文章:
1. javascript - axios請求回來的數據組件無法進行綁定渲染2. Python中使用超長的List導致內存占用過大3. java - spring boot 如何打包成asp.net core 那種獨立應用?4. java - 在用戶不登錄的情況下,用戶如何添加保存到購物車?5. javascript - main head .intro-text{width:40%} main head{display:flex}為何無效?6. javascript - JS變量被清空7. javascript - 關于apply()與call()的問題8. 安全性測試 - nodejs中如何防mySQL注入9. css3 - 純css實現點擊特效10. javascript - 有適合開發手機端Html5網頁小游戲的前端框架嗎?
