IE6の別のハック

ブラウザー間の互換性を確保することが、Web開発者の主な頭痛の種の1つであることは周知の事実です。 最近、Joomlaテンプレートの水平ポップアップメニューの描画に問題がありました。これは、最新のFireFox、Opera、およびIE7とIE6で同時に動作します。



UPD:このトピックは、新規のふりをしたり、原則として便利なふりをすることはありません。 ちょうど別の修正。



メニュー自体は、悪名高いsuckerfish.phpスクリプトを使用してレンダリングされます。

問題の本質は、IE6がCSSのhoverプロパティをサポートしていないことです。

ブラウザー間の互換性を確保するために、以下が発明されました。

1)以下のようにサザエ、phpを編集します。関数mosShowListMenu($ menutype)を見つけて、その中の行を置き換える必要があります

array( "<ul>", "<li >" , "</li>", "</ul>" ),



on

array( "<ul>", "<li onmouseover=\"this.className='over';\" onmouseout=\"this.className=this.className.replace('over', '');\">" , "</li>", "</ul>" ),





保存して、テンプレートのルートに配置します。 ここで、各<li>要素は、マウスオーバーすると、クラス名を「over」に変更します。これはIEのCSSで使用します。

次に、IE6では、CSSを記述します。CSSでは、要素の上にマウスを置いたときに、次のように.overクラスを操作する必要があることを考慮します。



.........



ul.nav li.over {

background-image:url(../images/navigation_back.jpg);

position:relative;

}

.........



ul.nav ul li.over {

border:1px solid white;

}

.........



ul.nav li.over ul {

visibility: visible;

}



ul.nav li.over ul li ul {

visibility: hidden;

}



ul.nav li ul li.over ul {

visibility: visible;

}



ul.nav li ul li ul li.over {

border:1px solid white;

}







All Articles