2

編集:私はこの問題を引き続き調査し、この JS Fiddle で問題を縮小しました。

http://jsfiddle.net/r7ab4/4/

「BUTTON - scroll down」をクリックして下に移動.colします。次に、「BUTTON - RETURN TO 0」をクリック.colして に戻り、元の位置に戻りmarginTop:0ます。そうでないことを除いて。最終的には、特定されていない値になります。なぜこれが起こるのですか?

以下の元の質問。


私の問題を確認するには、このテスト ページを参照してください。

http://joinersart.co.uk/test

フッターのコンテンツ ボタンをクリックすると、"col-aboutus" div が height:0 から height:100% に展開され、"コンテンツ ページ" が表示されます。戻るには、右上のホームをクリックします。

問題: 「col-aboutus」div とそのすべての子 div は、margin-top:0 に設定する必要があります。これは、コンテンツ ページに表示される最初の div が「SECTION ONE」であることを意味します。赤いリンク「NEXT - SECTION TWO」をクリックすると、margin-top が「-200px」にアニメーション化され、コンテンツが次のセクションにスライドします。問題は、赤いリンクをクリックすると、「col-aboutus」div の margin-top が未指定のマイナス値になり、「-200px」コマンドがスローされることです。また、正しい位置 "margin-top:0" には戻りません。Firebug で手動で「0」と入力しても、編集コンソールでは「margin-top:0」と表示されますが、未指定のマイナス値のままです。「ホーム」をクリックして開始ページに戻ると、コードはマージントップにリセットされます。0 ですが、赤いリンクが押された後は効果がありません。元に戻す唯一の方法は、ページをリロードすることです。

見落としがあるかもしれませんが、よろしければご覧ください。

4

1 に答える 1

0

わかりましたので、実際の問題はそうではないように偽装されたようです。すべての問題の理由はmarginTop、href リンク自体に関係しています。クリックすると、自分の位置(および接続されているdiv)を画面/ウィンドウの上部に移動するというデフォルトの動作があるようです。これが紛争を引き起こしました。解決するには、別のメンバーからこの回答に出会いました。これを href リンクに追加するだけです。

<a href="#" onClick="return false;">The question?</a>

または、JQuery を使用している場合:

$('a[href="#"]').click(function(event){

    event.preventDefault();

});

元の記事はこちら:リンクをクリックすると予期しないページがスクロールアップする

于 2012-11-08T22:48:41.080 に答える