1

Stack Overflowで同様の問題を検索しましたが、どの回答も問題を解決していません。基本的に、divのコンテンツを上下にアニメーション化する2つのボタンがあります。完全に正しく機能しますが、何度もホバリングした後、アニメーション効果は毎回遅くなっていることに気づきました。多くの回答が示唆しているように、私は「線形」イージングとstop()関数を使用しましたが、運がありませんでした。ここで実際の例を見ることができます:

http://www.diasporaduo.com(ディアスポラセクション)。

これが私のJqueryコードです(htmlは「diasporarightbottom」と呼ばれるdiv内の「display」と呼ばれるdivです)

<script>
$(document).ready(function(){

    var displayh= ($('#display').height()) - ($('#diasporarightbottom').height());

    $('#displayup').hover(
        function(){
            $('#display').stop().animate({'top': -displayh}, 8000, 'linear');
        },
        function() {
            $('#display').stop()
        }
    )

    $('#displaydown').hover(
        function(){
            $('#display').stop().animate({'top': '0'}, 2000, 'linear');
        },
        function() {
            $('#display').stop()
        }
    )


})

</script>
4

2 に答える 2

1

これは、div のスクロールの高さに関係なく、アニメーション時間が同じであるためです。したがって、上にスクロールするのに常に2 秒、下にスクロールするのに 8 秒かかります。

代わりに、8000 * ((height - scrollTop) / height)(たとえば) スクロールに関連する実際のアニメーション時間を取得する必要があります。

于 2013-01-27T02:20:59.727 に答える