加速滚轮滚动事件

我有一个自定义脚本，它可以在滚动滚动时前进一个小图标。它运作良好，但它并没有像我想的那样快速推进元素。我想增加元素（药丸）每轮滚动的距离。我如何改变代码以促进这一点？感谢您的任何见解。代码：加速滚轮滚动事件

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

加速滚轮滚动事件

回答

相关问题