0

左側にナビゲーション ウィンドウがある長いドキュメントの Web ページがあります。HTMLは基本的に

<body style="display:block;">
    <div id="nav-pane" style="width:340px; height:100%; position:absolute;">
         ....
    </div>
    <div id="main-page" style="left:371px; height:100%; position:fixed;">
         ....
    </div>
</body>

小さな画面でドキュメントを表示するためにナビゲーション ペインを非表示にする JavaScript 関数がありますが、IE 8/9 で $("#nav-pane").hide() を呼び出すと、ページ ビューがトップに戻ります。ページの。他のブラウザは正常に動作します

編集：ページ内のスタイルリンクは問題ありません

トリガーは

<div id="close-button" onclick="hideMenu()">
    <img src="/wp-content/uploads/images/original/close-button.png">
</div>

そしてJavaScript関数は

function hideMenu()
{
    $("#nav-pane").hide();
}
4

3 に答える 3

2

さらなる情報がない場合、いくつかの推測：

推測1

実際のコードにも、両方のdivの属性"の最後にがありませんか？style

<body style="display:block;">
    <!--                                                     here -------v -->
    <div id="nav-pane" style="width:340px; height:100%; position:absolute;>
         ....
    </div>
    <!--                                              and here -------v -->
    <div id="main-page" style="left:371px; height:100%; position:fixed;>
         ....
    </div>
</body>

これにより、マークアップの解析であらゆる種類の奇妙なことが起こる可能性があります。

推測2

「他のブラウザは正常に動作します」というあなたの発言は驚くべきものですが、次のようになります。

コードまたはそれをトリガーする方法のマークアップを表示していませんが、次のように推測しています。

<a href="#">the link</a>

...そしてそのハンドラー：

$("selector for the link").click(function() {
    $("#nav-pane").hide();
});

divを非表示にするために使用しているリンクのデフォルトのアクションを防ぐ必要があります。jQueryでは、preventDefaultハンドラーに渡すイベントオブジェクトを呼び出すかreturn false;、ハンドラーから呼び出すことでこれを行うことができます（これにより、デフォルトが防止され、伝播が停止します）。例えば：

$("selector for the link").click(function() {
    $("#nav-pane").hide();
    return false;
});
于 2012-07-26T09:19:03.327 に答える
1

TJ Crowder の答えはあなたの問題を解決するはずです。ただし、IE で同様の問題が発生しました。display親要素のまたはプロパティを変更するoverflowと、ブラウザーはドキュメントを再描画し、スクロール位置を 0 にリセットします。

ほとんどの場合、マークアップに問題があります。私の場合は親要素 (bodyまたはhtml) でした。

とにかく、これを解決するには、非表示アクションの前にウィンドウのスクロール位置を記録し、その後、記録された位置までウィンドウをスクロールします。

var scrollPosition = $(window).scrollTop();
// your hide action here, and then:
if ($(window).scrollTop() !== scrollPosition) {
    $(window).scrollTop(scrollPosition);
}
于 2012-07-26T09:42:38.593 に答える
0

マークアップに問題があったようです。divをdisplay：noneに設定するだけで、ウィンドウをリセットできます。私は現在、divの幅を0に設定し、可視性を非表示に設定することで回避策を講じています。これは、単語ファイルまたはApsoseのページを実際に見栄えよくするプログラムを変換するときに問題が発生する場合に発生します。ちゃんと。

みんなありがとう

于 2012-07-27T12:34:51.587 に答える