「メガメニュー」を「ホバー」から「フォーカス」に切り替えようとしています。ドロップダウンメニューを「クリック時」に表示し、他のトップレベルの選択がクリックされるまで表示したままにしたいと考えています。可能であれば、純粋な CSS ソリューションが必要です。
他の Q/A に基づいて、CSS 要素を「hover」から「focus」に変更し、関連する「li」タグに tabindex="1" を追加しました。Chrome では問題なく動作しますが、私が試した他のブラウザでは動作しません。
JS フィドルはこちら: http://jsfiddle.net/only1chip/QzwXV/
<li tabindex="1"><a href="#_" class="menuitem_drop">Home</a>
前もってお詫び申し上げます:メニューが「水平になる」前に、JSフィドルの「結果」ウィンドウをかなり広くする必要があります-これを行うまで、結果は無意味になります...フィドルのためだけにスキニーにしようとしました、しかし、それを機能させることができませんでした。
あなたが提供できる洞察に感謝します。
チップ
PS はい、その「メガ メニュー」は商用製品です。アプリケーションで動作するように変更できる場合は、希望価格を全額お支払いします。