1

テーブルにグループ化されたアイテムのリストがあります.30としましょう。私がやりたいことは次のとおりです。

  • ボタンのクリックやマウスイベントなしで、下から上に自動的に垂直にスクロールします

そして、ここに私が使用したコードがあります:

        function scrolling(){
            $('#scrollup table').animate(
            { 
                top: '-=10'
            },
            1000,
            'linear',
            function(){

                      if($('#scrollup table  tr:last').offset().top<0){
                     $('#scrollup table  tr:first').remove();   
                    $('#scrollup table  tr:last').after('<tr>'+$('#scrollup table  tr:first').html()+'</tr>');
                }
            }
        );
        }
        $(document).ready(function(){
            setInterval('scrolling()',200)
        });

何を見逃したのか、どこに問題があるのか​​教えていただけますか?

4

1 に答える 1

2

このコードをチェックしてください:

  function scrolling(){
        var table = $('#scrollup table');
        table.animate(
        { 
            top: '-=5'
        },
        200,
        'linear',
        function(){                
            if($('#scrollup table tr:first').height() <= -parseFloat(table.css("top"))){
                 $('#scrollup table').css("top", 0);
                 $('#scrollup table  tr:last').after($('#scrollup table tr:first').detach());
            }
        }
    );
    }
    $(document).ready(function(){
        setInterval('scrolling()',200)
    });​

正常に動作します ( demo ) が、すべての行の高さが等しい場合にのみ有効です。差分の高さの行で機能するより良い解決策を見つけようとしています。基本的に、コードの問題は、常にテーブルを上に移動することです（ を使用.animate）が、最初の行を削除してテーブルの最後に追加します（したがって、テーブルの高さは大きくなりません）

Upd コードが更新され、diff の高さの行で動作するようになりました。デモ

于 2012-09-28T17:10:30.767 に答える