Question

我有以下代码来滚动表格的滚动条

$('.myTable').animate({
    scrollTop: myPositon
}, 45000, function() {

});

现在我有以下事件侦听滚动条位置

$('.myTable').bind('scroll', function() {
   //if the scroll bar reaches certain position
   //pause the scrolling for 5 seconds

 });

我有代码检查滚动条是否到达某个位置，问题是如何在bind函数中暂停滚动/或动画5秒钟，然后自动恢复动画？

我知道有延迟和clearQueue。但是打电话：

$('.myTable').delay(5000) or $('.myTable').clearQueue似乎确实有任何影响

Answer 1

可能低于html解决你的问题

<html>
    <head>
        <style>
            div {
                position: absolute;
                background-color: #abc;
                left: 0px;
                top:30px;
                width: 60px;
                height: 60px;
                margin: 5px;
            }
        </style>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
    </head>

    <body>
        <button id="go">Go</button>
        <button id="stop">STOP!</button>
        <button id="back">Back</button>
        <div class="block"></div>
        <script>
            /* Start animation */
            $("#go").click(function () {
                $(".block").animate({
                    left: '+=100px'
                }, 2000);
            });

            /* Stop animation when button is clicked */
            $("#stop").click(function () {
                $(".block").stop();
                setTimeout(function () {
                    $(".block").animate({
                        left: '+=100px'
                    }, 2000)
                }, 1000);
            });

            /* Start animation in the opposite direction */
            $("#back").click(function () {
                $(".block").animate({
                    left: '-=100px'
                }, 2000);
            });
        </script>
    </body>
</html>

jQuery延迟/暂停动画

1 个答案: