0

コード例:http://jsfiddle.net/ZAm2A/3/

目標は、特定のpopup(div.absolute-block)ウィンドウを、異なるhtml構造を持つ任意のページの任意のdom要素に対して(相対的に)配置することです。ポップアップを絶対的に配置できるようにするには、ポップアップをそのdom要素に埋め込む必要があります。これは、以前にdiv.absolute-blockを比較的または絶対的に配置されたブロックでラップしたものです(div.relative1この例では)。
問題は、ポップアップを埋め込んだdom要素にoverfillwのブロックがある場合、そのdiv.overflow1祖先の中にhidden()が含まれていると、div.overflow1おそらくポップアップがトリミングされることです。 div.overflow1比較的配置されている可能性があり、私たちの状況ではそれに影響を与えることはできません。

2番目のアプローチは、ポップアップをページ本文に追加することです。この場合、特定のdom要素に対してポップアップを相対的に配置するという問題に直面します。ドキュメント準備完了イベントのポップアップの上部と左側のプロパティを計算して設定できます。ただし、ウィンドウのサイズ変更、ajaxコンテンツの変更、または追跡対象要素の位置を変更するイベントの場合は、ポップアップ位置を再計算する必要があります。

dom要素に埋め込まずにポップアップを配置できる新しいhtml5機能があるかどうかと思いますが、ポップアップを相対的に配置したいですか?他のアイデアは大歓迎です。

4

1 に答える 1

2

overflowに設定された親要素を子要素でエスケープする方法はありませんhidden。ページ上の特定の要素の真上に要素を配置したい場合、最も安全なオプションは、ドキュメントのルートに配置し、Javascript を使用して位置を計算および調整し、ウィンドウのサイズ変更時に更新することです。これを計算するために、jQuery のposition()(親に対して相対的な) またはoffset()(ドキュメント全体に対して相対的な) メソッドを使用することに興味があるかもしれません。

また、この問題に関する多少関連する質問overflow: hiddenが役立ちます: Make child visible outside an overflow:hidden parent

于 2012-11-22T00:02:48.103 に答える