附加处理程序窗口滚动事件

约翰Resig的建议，以便使用的setInterval（），以减少时间的处理程序被调用次数 - 见http://ejohn.org/blog/learning-from-twitter/附加处理程序窗口滚动事件

从博客文章约翰的解决方案：

var outerPane = $details.find(".details-pane-outer"), 
    didScroll = false; 

$(window).scroll(function() { 
    didScroll = true; 
}); 

setInterval(function() { 
    if (didScroll) { 
     didScroll = false; 
     // Check your page position and then 
     // Load in more results 
    } 
}, 250);

灿调用连续间隔真的是一个明智的想法？

迈克尔杰克逊的方法会更有意义，因为它并不意味着我们不断地进行投票吗？

迈克尔从评论的解决方案：

var timer = 0; 

$(window).scroll(function() { 
    if (timer) { 
    clearTimeout(timer); 
    } 

    // Use a buffer so we don't call myCallback too often. 
    timer = setTimeout(myCallback, 100); 
});

任何人都可以共享任何建议/意见？

富

来源

2011-02-08 riscarrott

+10

谁是迈克尔杰克逊？ – Anurag 2011-02-08 03:00:27

我忽略了提及迈克尔杰克逊留下了对约翰雷里格博客文章 – riscarrott 2011-02-08 15:13:02

约翰Resig的方法是最明智的。滚动事件在大多数现代浏览器中都被调度了。对于y轴上只有50px的快速滚动操作，可以调度20-30次。如果你在每个事件中都有一个处理程序被调用，你将锁定UI线程并滚动生成（如John指出的那样）。

另外，请记住，在现代浏览器中，每50ms执行一次快速函数并不是什么大问题。这是每5或6帧的函数调用。你试图避免的是每个帧的函数调用，这是使用滚动事件时会发生的情况。

编辑

噢，对不起，我错过了评论，当我张贴的第一个版本（我只搜索的职位MJ的名字没有评论）。限制scrollEvent处理程序的速度是一种智能方法+1。我实际上比Resig的策略更喜欢它，因为你会总是当它发生时得到第一个滚动事件，然后在每100ms之后限制每个其他滚动事件抛出一次。

使用Resig的方法，可能会在通知回调事件之前延迟100ms。 100ms的延迟可能被大量用户视为缓慢的界面。

来源

2011-02-08 07:48:31 Shakakai

我在阅读同一篇文章，但以一些混合的方式结束。

Jhon Resig和MJ都不适合我。虽然我真的apreciate光他们把我的研究

这里是我的代码，这是因为一旦事件被触发执行，但运行每250毫秒一次，当它是“重新启用”

var scrollEnabled = true; 

$(window).on('scroll', function(event) { 
    if (!scrollEnabled) { 
    return; 
    } 
    scrollEnabled = false; 
    console.log('i am scrolling'); 
    return setTimeout((function() { 
    scrollEnabled = true; 
    console.log('scroll enabled now'); 
    }), 250); 
});

来源

2012-08-09 19:04:04

附加处理程序窗口滚动事件

回答

相关问题