css and Jquery show sticky submenu

하위 페이지에서 고정적이어야하는 가로 방향 하위 탐색이있는 탐색 기능이 있습니다.css and Jquery show sticky submenu

나는 모두 CSS로 작업하고 있지만, 문제는 내가 다른 호스트 li 위로 마우스를 올려 놓을 때 자식 페이지의 끈적한 스티커 ul을 숨겨두고 맴돌지 않을 때 끈적 거리며 돌아갈 필요가 있다는 것입니다. 나는 jQuery가 이것을위한 유일한 해결책이라고 생각한다. 오타 빨리이 문제를 다시 쓴 것있다

<style type="text/css"> 
.current-menu-parent ul{ 
display:block !important; 
position:absolute!important; 
} 
#primary-nav ul li:hover ul { 
display:inline; 
position:absolute; 
} 
#primary-nav ul li > ul{ 
    display:none; 
} 
</style 

<script src="http://code.jquery.com/jquery-latest.min.js"type="text/javascript"> </script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#primary-nav ul li").mouseover(function(){ 
    $('.current-menu-parent ul').hide(); 
}); 
$("#primary-nav ul li").mouseout(function(){ 
    $(".current-menu-parent ul").show(); 
}); 
}); 
</script> 
<body> 
<div id="primary-nav"> 
    <ul> 
    <li>item</li> 
    <li class="current-menu-parent>This is the current menu parent item 
     <ul> 
      <li>Current page</li> 
      <li>page</li> 
      <li>page</li> 
     </ul> 
    </li> 
    <ul> 
</div>

죄송 경우 단지 : 여기

는 내가 지금까지 가지고있는 것입니다.

다음은 링크이므로 직접 문제를 볼 수 있습니다. 하위 페이지를 클릭하여 문제를 확인하십시오. 스틱의 원인이되는 .current-menu-parent ul

.current-menu-parent ul{ 
    display:block; 
    position:absolute; 
}

에

출처

2012-07-09 codeprokanner

제거 important.

다음 호는 .show()이 (가) .mouseout()이고 viceversa가 원인입니다.

$("#primary-nav ul li").mouseover(function(){ 
    $('.current-menu-parent ul').show(); 
}); 
$("#primary-nav ul li").mouseout(function(){ 
    $(".current-menu-parent ul").hide(); 
});

이제 첫 번째 문제 ... 예쁜 가까이 해결 LIVE DEMO

출처

2012-07-09 19:30:55

잘 참조하십시오. 유일한 문제는 jquery가 그 항목에 상속 받고있는 것처럼 끈끈한 ul에서 li 위에 마우스를 가져 가면 튀어 나옵니다. 나는 부모 리를 훨씬 더 구체적으로 타겟팅하고 첫 번째 자식 선택기를 사용했지만 어느 것도 작동하지 않는 것 같았습니다. – codeprokanner

css and Jquery show sticky submenu

답변

관련 문제