0

iframe と DHTML カレンダー ウィジェットを含む Web ページがあります。ページと iframe 内のコンテンツが正しく表示されます。問題は、カレンダーの一部が iframe によって隠されるほど iframe に十分近い位置にあるカレンダーをアクティブにするときです。

javascript と CSS (Zindex、z-index) の両方を使用して iframe の位置を操作しようとしましたが、iframe は常にページの最上位レイヤーとして表示され、同じ領域にレンダリングされる親 DHTML コンテンツを隠します。 iframe。また、DHTML カレンダーの css を値 > 0 に変更し、ウィジェット スクリプトレットを高い z-index 値を持つ div/span でラップしましたが、うまくいきませんでした。

4

4 に答える 4

0

問題はMSXMLとIEがXMLドキュメントを変換する方法に関連しているようだと気づきました。XMLには、ブラウザがXMLドキュメントを変換するために使用するXSLTスタイルシートの関連付けがあります。変換の出力はHTMLドキュメントです。HTMLが最終的にレンダリングされるものであるため、HTTP応答がXMLであることを開示することは重要だとは思いませんでしたが、それは重要です。IFRAMEのソースがHTMLドキュメントの場合、すべてが正常に機能します。DHTMLはIFRAMEの対象外です。しかし、MSXMLを使用してIFRAMEコンテンツを変換する場合、これは問題が発生するときです。以下は、問題を説明するいくつかのサンプルファイルです。DHTMLコンポーネントの場合、私はspiffycalendarウィジェットを使用していますが、どのDHTML要素でも同じ結果が得られると思います。

PARENT.HTML

IFRAMEDHTMLの競合の例 

                var pickupdate=new ctlSpiffyCalendarBox("pickupdate", "mainF", "PICKUP_DATE","btnDate1","",1);
            </script>

親ウィンドウフィールドフィールドFIELDpickupdate.writeControl（）; フィールドフィールドフィールド変更を保存

IFRAME.HTML

IFRAME.XSL ]> TEST XML DOC IFRAME CONTENT

于 2009-06-09T23:40:57.663 に答える
0

iframe の z-index は、IE によって奇妙な方法 で処理されます。それを取り除くことができる場合は、コンテンツを通常の Div に埋め込むことをお勧めします。

このようにする以外に選択肢がない場合は、IE6 では および のような要素の z-index が無限になることに注意してください。したがって、それをスタックする方法は、より高い zindex を持つ iframe を使用することです。これにより、無限対無限 +1 になります。

この例は、vs スタッキングです。どちらも無限の z インデックスを持っていますが、それらを積み重ねることができます。チェックアウト Stu Nicholls code、役立つ可能性があります。

それはかなり悪い考えです。私の修正は、この領域に他のフィールドを持たないようにすることです。

于 2009-06-09T20:25:01.753 に答える
0

iFrame を div で確実に覆うことができます。

重要なのは、カレンダー div で position:relative、position:absolute、または position: fixed を使用しない限り、z-index を使用できないことです。

やりたいことは、カレンダーの「位置」CSS プロパティを「相対」に変更することです。iFrame に通常の静的な配置がある場合 (つまり、特別な配置を追加していない場合、これは機能します)。

iFrame に「絶対」配置がある場合、カレンダーで「position:absolute」を実行する必要がある場合があります。

リンクを参照してください: http://resopollution.com/test/test.html

(IE6 を含む最新のすべてのブラウザーで動作します)

于 2009-06-09T20:27:26.790 に答える
0

同様の問題に対するさまざまな例と解決策については、「IE z-index bug」を Google で検索してください。HTML 仕様では、z-index は絶対的でなければならないと規定されていますが、IE では、親要素が配置されている場合、要素に対して決定できます。極端な状況では、問題を引き起こしている要素から DOM ツリーをさかのぼって追跡し、隠蔽されている要素ではなく、親要素の位置に z-index 属性を設定する必要がありました (当然のことながら z を持つ必要があります)。 -インデックス セット)。IE Developer ツールバーは、本当に混乱している場合に動的デバッグに役立ちます。適切に見えるものが見つかるまで、ツリーの z-index プロパティの設定を開始するだけです。

于 2009-06-09T20:33:26.653 に答える