カーソルdiv#new-menu-lower ul.menuul li.menuli
を合わせると、以下のコードの最初のulと最初のliに表示ブロックを追加します。問題は、すべてのulとliに表示ブロック/なしを追加することです。
$(document).ready(function() {
//on hover of sub menu li then highlight itself
$('div#new-menu-lower ul.menuul li.menuli').hover(
function() {
$('div#new-menu-lower ul li ul:first').css("display","block");
$('div#new-menu-lower ul li ul li:first').css("display","block");
$('div#new-menu-lower ul li ul li ul:first').css("display","block");
}, function() {
$('div#new-menu-lower ul li ul:first').css("display","none");
$('div#new-menu-lower ul li ul li:first').css("display","none");
$('div#new-menu-lower ul li ul li ul:first').css("display","none");
})
});
2番目のULLIにカーソルを合わせると、最初のul li ul liのみが表示され、それは間違っています。
私はそれの一部を次のようにして解決することができました:(display:block
サブメニューに追加されます--ulliulですが、他の要素には追加されません)
$(document).ready(function() {
//on hover of sub menu li then highlight itself
$('div#new-menu-lower ul.menuul li.menuli').hover(
function() {
$(this).children('div#new-menu-lower ul li ul').css("display","block");
$(this).children('div#new-menu-lower ul li ul li:first').css("display","block");
$(this).children('div#new-menu-lower ul li ul li ul').css("display","block");
}, function() {
$(this).children('div#new-menu-lower ul li ul').css("display","none");
$(this).children('div#new-menu-lower ul li ul li:first').css("display","none");
$(this).children('div#new-menu-lower ul li ul li ul').css("display","none");
})
});