当用户将鼠标移到屏幕/图表上时，自动滚动将暂停.如果鼠标移动停止，自动滚动将再次恢复

auto-scrolling will pause when user moves mouse over screen / graphs. And auto-scrolling will resume again if mouse movement is stopped

本文关键字：滚动 鼠标 暂停 如果 恢复 移动 用户 屏幕      更新时间：2023-09-26

您好，我有用于自动滚动页面的工作代码。我需要对此进行一些修改。当用户在页面上移动鼠标时需要暂停自动滚动，并且当没有鼠标移动时，自动滚动将恢复。

      <script>
    $("html, body").animate({ scrollTop: $(document).height() }, 400000);
        setTimeout(function() {
           $('html, body').animate({scrollTop:0}, 400000); 
        },400000);
        setInterval(function(){
             //  it will take 40 secound in total from the top of the page to the bottom
        $("html, body").animate({ scrollTop: $(document).height() }, 400000);
        setTimeout(function() {
           $('html, body').animate({scrollTop:0}, 400000); 
        },400000);
        },8000);
    </script>

希望这就是你要找的

  var x = 10,
    y = true,
    z = 1,
    maxscroll = 40,
    mixscroll = 10;
setInterval(function() {
    $('html, body').mousemove(function() {
        z = 0;
    });
    if (z === 0) {
        setTimeout(function() {
            z = x;
        }, 1000);
    } else {
        z = x;
        if (y) {
            $('html, body').animate({ scrollTop: ($(window).scrollTop() + z) + 'px' }, 300);
            x++;
        } else {
            $('html, body').animate({ scrollTop: ($(window).scrollTop() + -(z)) + 'px' }, 300);
            x--;
        }
    }
    if (maxscroll < x && y) {
        y = false;
    } else if (x < mixscroll) {
        y = true;
    }
}, 500);

https://jsfiddle.net/donS/9xdz86yu/

你可以在jQuery中使用.stop()函数，比如..

$("html, body").mouseover(function(){ 
           $(this).stop();
});

试试这个小提琴

相关文章：