0

次の jquery 関数を使用して、slideToggle .toggle-box を使用し、slideToggle が完了したら一番上までスクロールします。これは .toggle-box を下にスライドするとうまく機能しますが、上にスライドすると両方の機能が同時に実行されるように見えます。作業例: http://jsfiddle.net/7udLq/12/

jQuery(".toggle-box").hide();

jQuery("a.toggle").click(function (e) {

    jQuery(".toggle-box").slideToggle(1500, function () {
        jQuery("html,body").animate({
            scrollTop: jQuery(".toggle").offset().top
        }, {
            duration: 500,
            easing: "easeOutQuint"
        });
    });

    e.preventDefault();

});

更新: 修正は実際には非常に簡単で、単純な css で機能します。bottom:0; を追加することにより 切り替えられたボックスにそれは正常に動作します

.toggle-box {
    background-color:green;
    height:500px;
    bottom:0;
}

http://jsfiddle.net/7udLq/16/

4

1 に答える 1

0

問題は、ボックスslideup、ボディの高さが変更され、ブラウザscrollがページの上部に移動したときです。

ここで話していることを参照してください:(スライドダウン/スクロールトップが完了したときに一時的なdivを挿入して、デモンストレーション目的でslideDown/slideUpを使用しています)

http://jsfiddle.net/7udLq/13/

于 2013-01-18T17:49:32.977 に答える