對不起,英語不好。這里是網站的鏈接。我的任務是創建沒有滾動的網站。當用戶單擊屏幕的右側部分時,汽車開始向前移動。當它到達屏幕中間時,汽車停下來,固定的內容塊開始朝相反的方向移動。如果用戶將光標移到屏幕左側(按住鼠標按鈕的同時),則汽車應向后移動。桌面版本按預期工作。但是移動版本很慢。(這并不是很慢,我猜它還不如臺式機那么順暢)我該怎么解決這個問題?在touchstart事件上,我獲得event.pageX值來檢查屏幕用戶觸摸過的部分。(這樣我就知道汽車應該向哪個方向移動)并將此值存儲在變量“ mousePos”中。然后我用運動函數調用setInterval在touchend事件中,我清除了間隔以阻止汽車行駛。在touchmove上,我將使用新的event.pageX值重寫“ mousePos”變量。例如:用戶單擊,汽車開始移動,如果用戶將光標向左移動,我將使用此變量來檢查方向并向后轉汽車。在mouseMove功能中,我將檢查汽車的位置并決定應采取的措施-移動汽車或移動背景,然后我將檢查其是否到達終點事件: $(document).on('mousedown touchstart', '.mouse-click', function(event){ clicking = true; mousePos = event.pageX; if ( event.target.className == 'helper' ) { showModal(); } else { moveStuff = setInterval(mouseMove, 1); } }); $(document).on('mouseup touchend', function(){ clicking = false; carLights.removeClass('blink'); clearInterval(moveStuff); }) $(document).on('mousemove touchmove', '.mouse-click', function(event){ if(clicking == false) { return; } else { mousePos = event.pageX; } });功能: function mouseMove() { let offset = parseInt( mainContent.css('left') ); let offsetCar = parseInt( car.css('left') ); if ( mousePos > middleScreen ) { carLights.removeClass('blink'); if ( offset < - ( contentWidth ) ) { return; } else { rotateWheelsForward(); if ( offsetCar < middleScreen ) { car.css('left', (offsetCar + mouseSpeed) + 'px'); } else { mainContent.css('left', (offset - mouseSpeed) + 'px'); } } } else if ( mousePos < middleScreen ) { carLights.addClass('blink'); if ( offset > 0 ) { carLights.removeClass('blink'); return; } 那么,如何在移動設備中使運動更流暢?(我使用iphone 5s野生動物園,但在iphone 6中進行了測試,但效果仍然很差)我應對此代碼進行哪些更改?
如何使jQuery setinterval在移動中更流暢?
瀟瀟雨雨
2021-04-09 14:15:21