2011-03-17 4 views
1

목록 항목 위에 마우스를 가져갈 때 "무언가"를 수행하는 방법은 어떻게 될까요?는 LI를 통해 가져갈 때 "무언가"를 수행하지만 LI를 포함 할 때가 아니라면

예 :

$('#mainnav li').hover(function() { 
    $(this).find('ul').stop(true,true).slideDown(100); 
    $(this).find('a:first').css({ 
     "background-image": 'url(/assets/images/nav_bg2.png)', 
     "color": '#fff', 
     "text-shadow" : '1px 1px 1px #000' 
    }); 

}, function() { 
    $(this).find('ul').stop(true,true).slideUp(100); 
    $(this).find('a:first').css({ 
     "background-image": 'none', 
     "color": '#630872', 
     "text-shadow" : '1px 1px 1px #fff' 
    }); 
}); 

샘플 HTML

<div id="mainnav"> 
<ul> 
    <li class="active nav-home"> 

     <a href="/">Home</a> 
     <ul> 
      <li><a href="/home/welcome">Welcome</a></li> 
      <li><a href="/home/latest-conveyance">Latest Conveyance</a></li> 
     </ul> 
    </li> 

    <li class="nav-who-we-are"> 

     <a href="/who-we-are">Who We Are</a> 
     <ul> 
      <li><a href="/who-we-are/history">History</a></li> 
      <li><a href="/who-we-are/culture">Culture</a></li> 
      <li><a href="who-we-are/people">People</a></li> 
      <li><a href="who-we-are/vision">Vision</a></li> 

     </ul> 
    </li> 


    <li class="nav-what-we-do"> 
     <a href="/what-we-do">What We Do</a> 
     <ul> 
      <li><a href="/what-we-do/services">Services</a></li> 
      <li><a href="/what-we-do/projects">Projects</a></li> 

      <li><a href="/what-we-do/portfolio">Portfolio</a></li> 
      <li><a href="/what-we-do/philanthropy">Philanthropy</a></li> 
     </ul> 

    </li> 

</ul> 
</div> 

여기에 문제가 있지만 아래에 중첩 된 것들, 내가 최고 수준의 목록 항목에 일부 CSS를 적용 할 것입니다. 이 코드는 현재 최상위 목록 항목 내부의 목록 항목에 마우스를 올려 놓을 때마다 CSS를 적용합니다. 이게 말이 돼?

은 BTW,이 메뉴를 들면, 내가 당신의 선택에서 더 구체적으로 드롭 다운

답변

1

을 스크롤하면서 불을 유지하는 탭 가기를 원하는 것입니다. '#mainnav li''#mainnav>ul>li' 또는 '#mainnav>ul>li>a'으로 변경해보세요.

0

가장 쉬운 일을 사용하여 볼 경우 CSS가 특별히 선택 있는지 확인하는 것입니다 강조 표시 할 않는 리튬의 :

#mainnav > ul > li.classname { 
    /* css code here */ 
} 

그래서 클래스 이름을 설정하는 JQuery와 클래스 이름을 설정하고 나면 최상위 레벨 요소와 일치하는 li 요소 만 선택하는 CSS 선택기가 트릭을 수행해야합니다.

관련 문제