3

私の問題は、(固定位置) div をクリックして別の div をアニメーション化すると、ページ全体が一番上にジャンプすることです。私は preventDefault を試して false を返しましたが、何も問題を解決していないようです! 助けてください。

ここにスクリプトがあります 

$(document).ready(function(){

    $("#close").click(function(){
        $("#info").animate({ 
            width: "0",
            height:"0"
        }, 100 );

        $("#info").hide(),
        $(".container").animate({ 
            left:"0",
            width:"100%"
        }, 100 );
        return false;
    });

    $(".sidebar").click(function(evt){
        evt.preventDefault();
        $("#info").show(),
        $("#info").animate({ 
            width: "25%",
            height:"100%",
            left:"0"
        }, 100 );

        $(".container").animate({ 
            left: "25%",
            width:"75%"
            }, 100 );
        return false;
    });
});
4

1 に答える 1

7

トリガー要素が空のアンカーの場合 

<a href="#">some val</a>

クリックすると、場所のハッシュが「#」に変わります。空のハッシュに対応する領域が見つからないため、ブラウザーはページを一番上にスクロールします。
できることは次のとおりです。 

$('a[href=#]').on('click', function(e){
     e.preventDefault();
 });

または、10 年前と同じように行うこともできます: 空のアンカー href を空の javascript ステートメントに変更します。 

<a href="javascript:void();">some val</a>

更新
マークアップを見た後、解決策が見つかりました。あなたがしなければならないのは、あなた.containerがスクロールできることを確認することだけです. アニメーション化中、要素は css プロパティを取得しoverflow : hidden(どこから取得したのかよくわかりません)、スクロール位置をリセットします。したがって、これをスタイルシートに追加するだけです。 

.container{
    overflow: auto !important;
}
于 2012-10-16T05:33:31.987 に答える