0

ボタンが1つあるHTMLページをデザインしています。ユーザーがボタンをクリックすると、単純なjQueryスクリプトがそのdivをアニメーション化して、より低いページのコンテンツを表示します。ここで見ることができます。

初めて見た目や動作に問題がないことに気づきましたが、ブラウザのボタンでページを更新しても完全にはリセットされません。最初のコンテナはページの半分にすぎません。もう一度URLを入力してページを読み込むと、期待どおりにリセットされます。 注：これは、最初のボタンをクリックした後に少し下にスクロールした場合にのみ発生します...これは奇妙に思えます。

この2つの操作に違いがあるとは思いもしませんでしたが、明らかに違いがあります。違いは何ですか？この問題が発生しないようにするにはどうすればよいですか？

関連する場合に備えて、これが私のjQueryコードです。

    $(document).ready(function(){

    var faqs = $("#FAQ");
    $("#learnmore").click(
        function(){
            $("#home").animate({top:'-=1066px'},600);
            $("#more").animate({top:'-=1066px'}, 600, function() {$("#background").hide();} );
            $("body").css('overflow-y', 'scroll');

            //$("#home").slideUp();
            console.log("jquery loaded");
            }
        );

});
4

2 に答える 2

2

これは、ブラウザによってキャッシュされているために発生します。

スタイルが定期的に変更される場合、簡単な修正は、参照の最後に一意のIDを付けることです。

<link href="style.css?time=168768234928" ..../>

それが何をするか、それはそれがロードされるたびにそれが新しいリクエストであるとブラウザに思わせます。

于 2012-04-20T22:46:02.360 に答える
0

これは、ブラウザがページのリロード前と同じ位置にスクロールしようとしたために発生します。確認するには、ボタンを押して、ページの一番下までスクロールしてからページをリロードしないでください。わかりました、理由は明らかです。

今、私たちは解決策が必要です。これを試して：

#more {display:none}

あなたのCSSで。そして、

$("#more").show().animate(...

あなたの$("#learnmore").click()関数で。これで問題が解決することを願っています。

于 2012-04-20T22:57:20.667 に答える