iframeシミングまたはie6（および以下）z-indexバグを選択

StackOverflow https://stackoverflow.com/questions/224471

質問

この問題に誰かが遭遇したかどうかはわかりません
IE6には簡単な説明があり、すべての<select>オブジェクトは他のアイテムの上に表示されます。divの場合でも... ..）特定の要素のonclickとそのdivが<=>に重なり、divが<=>の下にあるかのように表示されます[この場合、最大および最小のZインデックスは機能しません]

グーグルで試したところ、iframeシムソリューションが見つかりました
しかし、かなりきれいな代替品が欲しかった またはより良いまだ誰もがより良いソリューションを見つけましたか？ iframeを使用する方法では約130 MBのRAMを使用するため、貧しい人々のマシンが遅くなる可能性があります

役に立ちましたか？

解決

ループを使用してすべてのselectを非表示にする必要はありません。必要なのは、次のようなCSSルールだけです。

* html .hideSelects select { visibility: hidden; }

そして次のJavaScript：

//hide:
document.body.className +=' hideSelects'

//show:
document.body.className = document.body.className.replace(' hideSelects', '');

（または、お気に入りのaddClass / removeClass実装を使用できます）。

他のヒント

bgiframe というjqueryのプラグインがあり、iframeメソッドの実装が非常に簡単になります。 。

個人的に、Web開発者として、私はIE6でのユーザーエクスペリエンスを気にしなくなりました。 <！> quot; correct <！> quot;に近いようにレンダリングします。可能な限り、機能していることを確認しますが、速度に関してはあまりにも悪いです。彼らはアップグレードできます。 IE7（他のすべてのブラウザに比べてまだかなり遅いですが）は2年間（ほぼ毎日！）使用されていません。 IE8は間もなくリリースされる予定です。 Firefoxはすべてのプラットフォームで利用可能です。 Safariもオプションです（そして超高速）。 Operaはほとんど/すべてのプラットフォームで利用可能です。

IE6は7年以上前にリリースされました。私見、怠zyなユーザーと無能なIT部門（またはWeb開発者の場合）以外に、それをまだ使用する理由はありません。

誰かが興味を持っている場合のために、IEのシミングコードをいくつか紹介します。

* html .shimmed {
    _azimuth: expression(
        this.shimmed = this.shimmed || 'shimmed:'+this.insertAdjacentHTML('beforeBegin','<iframe style="filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);position:absolute;top:0px;left:0px;width:100%;height:100%" frameBorder=0 scrolling=no src="javascript:false;document.write('+"''"+');"></iframe>'),
        'inherit');
}

ref：この要点 by subtleGradient およびこの Zach Leathermanによる投稿

IE7より前のドロップダウンリストは<！> quot; windowed <！> quot;でした。 controlは、ブラウザがそれを合成するのではなく、Windowsによって直接コントロールとしてレンダリングされたことを意味します。そのため、他の合成コントロールに対するz-indexingをサポートすることはできませんでした。

DDLの上に表示するには、IFRAMEなどの別のウィンドウコントロールを使用する必要があります。また、本質的にクロムレスポップアップを作成するwindow.createPopup（）と呼ばれるあまり知られていないIEのみの機能を使用することもできます。止められないクリックアウトなどの制限がありますが、ホバーメニューシステムを構築している場合は実際に役立ちます。

この厄介なIEバグに対する最もシンプルでエレガントな解決策は、 http：// docsにあります。 jQueryを使用してjquery.com/Plugins/bgiframe

フライオーバーメニューを含むすべてが動的であるWebSphere Portal / Portal Applicationsで2日間動作させようとした後、その結論に達しました。

activexメソッドもありますが、これを検討し始めています。 ie6の選択ボックスの代わりにactivexコントロールを使用するには、条件コードを作成する必要があります。テクニックを示すデモスクリプトがあり、これは詳細についてはこちらをご覧ください。

更新：active-xコントロールがユーザーのマシン上にあるためには、MS Officeが必要と思われます。理論的には、それをどこかに、何らかの形で含めることは可能かもしれませんが、それはかなり厄介になっています。

多くの人が自分のヒントを提案したことは知っていますが、私の場合は、次のようにjqueryを使用してselectを非表示にします。

$(':date').dateinput({
    format: 'dd/mm/yyyy',
    onBeforeShow: function(event) {
        $('select').hide();
    },
    onHide: function(event) {
        $('select').show();
    }
});
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top