5

X秒ごとに50ピクセル下にスクロールしたいスクロール可能なdivがあります。それは問題なく機能しています。

また、divが一番下に達したときに、divを一番上にスクロールして戻す別の関数もあります。また大丈夫です。働く。

ここで、2つを組み合わせる必要があります。これにより、再び上にスクロールするまでスクロールダウンが無視されます。

ここに「動作する」例があります。これは、かなり厄介な動作をしていることがわかります：http: //jsfiddle.net/JVftf/

window.setInterval(scrollit, 3000);

function scrollit() {
    $('#scroller').delay(2000).animate({ scrollTop: $("#scroller").scrollTop() + 50 }, 'slow');
}

$('#scroller').bind('scroll', function () {
    if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
        $('#scroller').delay(2000).animate({ scrollTop: 0 }, 1000);
    }
});
4

2 に答える 2

4

私のバージョン：

var scrollingUp = 0;

window.setInterval(scrollit, 3000);

function scrollit() {
    if(scrollingUp == 0) {
        $('#scroller').delay(2000).animate({ scrollTop: $("#scroller").scrollTop() + 50 }, 'slow');
    }
}

$('#scroller').bind('scroll', function () {
    $('#status').html(scrollingUp);

    if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
        scrollingUp = 1;      
        $('#scroller').delay(2000).animate({ scrollTop: 0 }, 1000, function() {
            scrollingUp = 0;    
        });
    }
});​

デモ： http： //jsfiddle.net/EFmeK/

ところで、あなたのjsfiddleでは、50pxではなく60pxをスクロールします。これは、私の例では「修正」しました。

于 2012-10-25T11:24:53.697 に答える
2

そのようなものを試してください：http：//jsfiddle.net/JVftf/3/

window.setInterval(scrollit, 1000);

function scrollit() {
    console.log(($("#scroller").scrollTop() + $("#scroller").innerHeight()))
    console.log($("#scroller")[0].scrollHeight)

    if(($("#scroller").scrollTop() + $("#scroller").innerHeight()) >= $("#scroller")[0].scrollHeight)   
        $('#scroller').animate({ scrollTop: 0 }, 100).delay(900);  
    else   
        $('#scroller').animate({ scrollTop: $("#scroller").scrollTop() + 60 }, 'slow',function(){

    });
}
于 2012-10-25T11:16:32.247 に答える