1

ログを含む div があります

<div id="log">
   <div class="logitem"></div>
   <div class="logitem"></div>
   <div id="containerbottom"></div> 
</div>

ログに、実行時に、不明な数の を追加します<div class="logitem"></div>。

アイテムを追加した直後にコンテナの一番下までスクロールしたい

私は使用してみました：

$('#log').animate({
     scrollTop: $('#containerbottom').offset().top
});

しかし、うまく機能していないようです。

それを行うための他のオプションは何ですか？

ありがとう

4

2 に答える 2

4

下にスクロールする間隔で呼び出される関数を使用してみてください。

function scrollDown()
{
    $("html, body").animate({ scrollTop: $(document).height() },'slow');
}

setInterval(scrollDown,1000); // Executes function every 1,000 milliseconds.

編集：

私は最近、イベント キューが詰まるのを避け、エラーが発生した場合に大量のエラー メッセージが繰り返されるのを避けるために、可能な場合setTimeoutは代わりに再帰を使用することをお勧めすることを発見しました。setIntervalこの方法は、正確なタイミングを必要としないアプリケーションにのみ適しています。正確に 1,000 ミリ秒ごとに関数を呼び出す必要がある場合(ストップウォッチなど) は、引き続きsetInterval.

例：

(function scrollDown(){
    $("html, body").animate({ scrollTop: $(document).height() },'slow');
    setTimeout(scrollDown,1000);
})();

jQuery アニメーションが jQuery のアニメーション キューに積み重なっている場合は、.stop().animate(...)

于 2012-07-25T16:50:15.763 に答える
0

問題は、実際にはhtmlとbodyであるときに#logをアニメーション化しようとしていることです（どちらか一方が気に入らないブラウザを修正するために、両方を使用しています）。

これは、JSライブラリで使用する簡単な関数で、＃idを除いて動的ですが、基本的には$（'html、body'）。animate（）;をスクロールします。

jsFiddleの例

jNamespace._goToByScroll = function(id) {
    //NOTE: Scroll to specific #ID in html
    //Useage: jNamespace.goToByScroll('top') - ommit #, added inside function
    //ENDNOTE

    $('html,body').animate({ scrollTop: $("#" + id).offset().top }, 'slow');
};
于 2012-07-25T15:25:00.097 に答える