私は2つの問題を抱えているメガメニューを持っています。
- 各セクションにカーソルを合わせると、ホバー状態をアクティブに保つことができないようです。
- メガメニューをトリガーするヘッダータグは、それらが含まれているコンテナの幅を持っているようです。これにより、視覚的にロールオーバーしなくても、メガメニューがポップアップ表示されます。
メガメニューの現在のコードをここに投稿しました:http ://www.boyga.com/mega-menu/
ホバーインテントプラグインを使用しています。
私は2つの問題を抱えているメガメニューを持っています。
メガメニューの現在のコードをここに投稿しました:http ://www.boyga.com/mega-menu/
ホバーインテントプラグインを使用しています。
問題#2は簡単に修正できます。このCSSルールをスタイルシートに追加します。
ul#Top-Nav {
display: inline-block;
}
問題#1はほとんど同じくらい簡単です。それはCSSの変更です。サブメニューは<li>から下がっていますが、から下がっていないため<a>、およびを含むCSSルールを変更する必要がありa:hoverますa:active。
ul#Top-Nav li:hover a{color:#1E90FF;text-decoration:none;}
ul#Top-Nav li:hover a{background:#1E90FF url(arrow.png) no-repeat right center;color:#fff;}
ul#Top-Nav li:active a{background:#1E90FF url(arrow.png) no-repeat right center;color:#fff;}
これは、少なくともChromeでは機能します。:hoverと:active疑似クラスがバブルアップしない他のブラウザで問題が発生する可能性があります(おそらく読んでください) 。