加速滾輪滾動事件

我有一個自定義腳本，它可以在滾動滾動時前進一個小圖標。它運作良好，但它並沒有像我想的那樣快速推進元素。我想增加元素（藥丸）每輪滾動的距離。我如何改變代碼以促進這一點？感謝您的任何見解。代碼：加速滾輪滾動事件

function wheel(e) { 
var modelContentWrapper = $('.model-content-wrapper'); 
var howModelWorks_steps = $('#howModelWorks_steps'); 

var currentIndex = $('.model-content.active', modelContentWrapper).index(); 
var $pill = $('.step_' + (currentIndex + 1) + ' > a.clickable-icon'); 
var $li = $('ul.steps li'); 
var $pillStep = ($li.width())/wheelSpeed; 
direction = 'right'; 
if ((e.wheelDelta && e.wheelDelta >= 0) || (e.detail && e.detail < 0)) { 
    wheelValue++; 
    if ((firstElement && parseInt($pill.css('margin-left')) > initialIconLeft) || (!firstElement)) { 
     $pill.css('margin-left', (parseInt($pill.css('margin-left')) - $pillStep) + 'rem'); 
    } 
    if (wheelValue >= wheelSpeed) { 
     wheelValue = wheelValue - wheelSpeed; 
     forceModelBackward(); 
    } 
    //direction = 'left'; 
} 
else { 
    wheelValue--; 
    //direction = 'right'; 
    if (!lastElement) { 
     $pill.css('margin-left', (parseInt($pill.css('margin-left')) + $pillStep) + 'rem'); 
    } 
    if (Math.abs(wheelValue) == wheelSpeed) { 
     wheelValue = wheelValue + wheelSpeed; 
     forceModelForward(); 
    } 
} 


//if (wheelValue > (wheelSpeed * 5) || wheelValue < (wheelSpeed * -5)) { 
if (stepsCounter == 1 || stepsCounter == 4) { 
    enableScroll(); 
} 
preventDefault(e); 
}

來源

2017-08-04 pjldesign

你瞭解你的自己的代碼？ – SLaks

我假設輪子被稱爲滾動事件的一部分？ – Taplar

可能要包含forceModelBackward（）和forceModelForward（）函數。 –

嘗試添加遵循自己的事件偵聽器..

捕獲：真，被動：真

被動事件監聽器允許您未取消處理程序附加到事件，讓瀏覽器圍繞你的事件監聽器進行優化。例如，瀏覽器可以以本地速度繼續滾動，而無需等待事件處理程序完成執行。

使用

大概是幹什麼用的大多是：

// Really, if you're using wheel, you should instead be using the 'scroll' event, 
    // as it's passive by default. 
    document.addEventListener('wheel', (evt) => { 
     // ... do stuff with evt 
    }, true)

您需要使用它來取代它：

document.addEventListener('wheel', (evt) => { 
    // ... do stuff with evt 
}, { 
    capture: true, 
    passive: true 
})

複製的信息從alligator dot io

來源

2017-08-04 20:53:08

加速滾輪滾動事件

回答

相關問題