ナビゲーションを作成しました。リンク上にマウスを置くと、下のナビゲーションナビが表示され、下のナビゲーションメニューがアクティブなものなどのリンクをクリックすると問題が発生します。トップレベルのリンクをホバーすると、発砲して深刻なちらつきを引き起こした。誰かが私がどこに間違っているかもしれないかアドバイスできますか？これを解決できますか？ここhttp://jsbin.com/ijofis/15ナビゲーションリンク上をホバリングすると、一定のちらつきを防ぐことができますか？
変更hovermouseenterへ
jsbinリンクこのリンクを入力すると、あなたの関数にのみ実行されるように。
あなただけの隠れ/非表示解除のためのCSSを使用することができます。
li:hover ul {display:block !important;}
あなたのコードを簡略化することでしょう。
/*
Task: The messed up GOMO navigation
*/
$(document).ready(function() {
var lowerNav = $('.lower', '#main-nav').hide();
$('#main-nav > li > a').on('click' , function(e){
if(!$(this).parent().hasClass('flag')){
$('#main-nav > li').removeClass('flag');
$('.lower').hide();
$(this).parent().addClass('flag');
$(this).next().show();
}
e.preventDefault();
});
});
ここでは例です：http://jsfiddle.net/nTwKH/
また、CSSのこのラインはあなたの現在のコードを修正しているようだ：
a {text-decoration:none;color:#343434; z-index:1; position: relative;}
あなたのCSSがボタンの上に内側リンクを配置しています。 .lowerを.lowerに変更する（position：絶対; top：0; left：30px;背景：赤;}あなたは何が起こっているかを見ることができます。左の値を大きくする必要があります。 –
私は質問をした人に返信していないことに気付かなかったので、私は「あなた」を使ったのです。 @GGG、私はあなたがボタンが常に内側のリンクの上に現れることを確認するためにZ-インデックスを修正したことを確認します。 –