Question

如果有可能以某种方式编写一个片段，在窗口的滚动功能期间，主体附加了一个类？

$(window).scroll(function() {
    $('body').toggleClass('scrolling');
 });

如果用户正在滚动，那么正文有一类“滚动”。如果当前没有滚动，则正文没有课程。

滚动功能似乎随着上述功能迅速启动。

Answer 1

没有“滚动开始”和“滚动结束”对，如“鼠标向下”和“鼠标向上”：“滚动”事件更像是“刚刚发生滚动”。如果 n 毫秒没有滚动，您可以设置超时以清除“滚动”类：

var scrollTimerId;

$(window).scroll(function() {
    if (!scrollTimerId)
       $('body').addClass('scrolling');

    clearTimeout(scrollTimerId);
    scrollTimerId = setTimeout(function(){
        $('body').removeClass('scrolling');
           scrollTimerId = undefined;
    },150);
});

演示：http://jsfiddle.net/8CaRE/2/

（改变延迟直到找到你满意的东西 - 对我来说150毫秒似乎是Chrome中的一个合理设置。）

Answer 2

可能在性能方面不是很健康，但是你可以添加一个setInterval来每隔几毫秒删除一次与你的scroll处理程序相结合的类，以便在滚动时添加它。

$(window).on('scroll', function() {
    $('body').addClass('scrolling');
});

setInterval(function() {
    $('body').removeClass('scrolling');
}, 100);

http://jsfiddle.net/pYVL8/

或略微优化：

setInterval(function() {
    document.getElementsByTagName('body')[0].className = '';
}, 100);

http://jsfiddle.net/pYVL8/1/

在滚动功能期间切换类

2 个答案: