2013-07-09 2 views
0

У меня проблемы с моей функцией «зависания». По большей части работает полная функция. Я могу навести <li>, чтобы выявить базовый <ul> по желанию. Проблема возникает, когда пользователь зависает с <li>, чтобы выбрать ребенка <ul> и ссылки. Как вы можете увидеть «парит из» функции пинки в и отрицаете тот факт, что ребенок <ul> находится в пределах родителя <li>jQuery Основные проблемы с навигацией

example of the issue: If you hover over the li and try to selecet the sub menu

Я попытался позиционирование множественной CSS и стили, и приехал сюда:

nav { 
    width:100%; 
    height:50px; 
    background:url(../assets/navBG.jpg) 0 0 repeat; 
    position:relative; 
    z-index:999; 
} 

ul.nav { 
    list-style:none; 
    position:absolute; 
} 

ul.nav li { 
    float:left; 
    font-family: 'PlayRegular'; 
    font-size:18px; 
    color:#fff; 
    padding:13px 43px; 
    background:url(../assets/navIcon.png) center right no-repeat; 
    cursor:pointer; 
} 

ul.nav li > ul { 
    position:absolute; 
    display:none; 
    list-style:none; 
    width:100%; 
    height:auto; 
    top:50px; 
    left:0; 
    overflow:hidden; 
    background:#000; 
} 

Я работал с Jquery к slideDown ребенка ул но не могу найти способ, чтобы позволить ему быть «парить-состояние»

$("ul.nav li").hover(function() { 
    $(this).find("ul").slideDown({ 
     duration: 300, 
     easing: "linear", 
     queue: false   
    }); 
}, function() { 
    $(this).find("ul").slideUp({ 
     duration: 300, 
     easing: "linear", 
     queue: false  
    }); 
}); 

Я что-то упустил, чтобы ребенок <ul> считался частью материнской компании <li>? это проблема JQuery или CSS? Я знаю, что это не проблема, потому что HTML я 100% уверен, что я написал это семантически правильно, без открытых <divs>

ответ

0

ваших скриптов работает нормально здесь, DEMO http://jsfiddle.net/yeyene/4RxGf/1/

В этой демонстрации, JQuery Lib является v1.9.1 , протестировать свой сайт с помощью этой версии?

$("ul.nav li").hover(function() { 
    $(this).stop().find("ul").slideDown({ 
     duration: 300, 
     easing: "linear", 
     queue: false   
    }); 
}, function() { 
    $(this).stop().find("ul").slideUp({ 
     duration: 300, 
     easing: "linear", 
     queue: false  
    }); 
}); 
+0

Хорошо работает функция .stop(), которая отлично работает именно с тем, что мне нужно было сделать. Большое вам спасибо, я запомню это сейчас на будущее. – WeebleWobb

+0

Рад, что это работает для вас. – yeyene