jquery を使用して iframe_HTML/Xhtml_Web ページ制作時のページアンカーの失敗問題を修復する-htmlチュートリアル-php.cn

jquery を使用して iframe_HTML/Xhtml_Web ページ制作時のページアンカーの失敗問題を修復する

WBOY

リリース： 2016-05-16 16:37:04

オリジナル

1270 人が閲覧しました

アプリケーションのシナリオは次のとおりです。iframe ページにはスクロールバーがありません。親フォームにスクロールバーが表示されると、アンカーポイントは現在のウィンドウのスクロールバーに基づいてウィンドウをスクロールするため、アンカーマークは無効になります。子フォームではスクロールバーがありませんので、当然スクロールしません。

解決策は、js を使用してページがネストされているかどうかを判断し、js を使用して親フォーム内の iframe の位置とフレーム内のアンカーポイントの位置を計算し、その 2 つを加算すると次のようになります。親フォームのスクロール。

問題が発生しました: 親フォーム要素を取得します (ドメイン制限のため、すべてがネットワーク環境 (つまり http://domain.com) 内にある必要があります)。親フォームが複数の iframe をネストしているかどうかを判断します。それは現在の iframe ページです。

コード:

親フォームページのindex.html

コードをコピー

コードは次のとおりです:

</title< ;style type="text/css"> <br>*{ <br>マージン: 0; <br>ボーダー: 0; <br>html, <br>ボディ{ <br> 幅: 100%; <br> 高さ: 100%; <br> </head> style= "width:100%;background:#f00;height:500px;"></div> <br><a href="">dd</a> <br><a href= "" >ddd</a> <br><iframe name="iframe2" id="iframe2" src="iframe.html?a=b&c=d" style="width:100%;height:2060px; "> ;</iframe> <br><iframe name="iframe2" id="iframe2" src="iframe.html?a=d&c=b" style="width:100%;height:2060px;" > </iframe> <br></html> <br><br><br>サブフォームページ iframe.html <br><br><br><br><br>コードをコピーします<br><br> </div>コードは次のとおりです:<br><br> <br><!doctype html> <div class="msgheader"><html> ; <div class="right"><title> ="jquery -1.8.2.min.js">

著者別の最新記事