2010-05-18 4 views
2

je la liste suivante:jQuery appliquent fonctionnalité uniquement aux éléments de classe et des parents

<ul> 
<li class="topCurrent">One 
    <ul> 
     <li>One-1 
      <ul> 
       <li>One-1.1 
        <ul> 
         <li class="current">One-1.1.1 
          <ul> 
           <li>One-1.1.1.1</li> 
           <li>One-1.1.1.2</li> 
           <li>One-1.1.1.3</li> 
          </ul> 
         </li> 
         <li>One-1.1.2</li> 
        </ul> 
       </li> 
       <li>One-1.2</li> 
      </ul> 
     </li> 
     <li>One-2</li> 
     <li>One-3</li> 
    </ul> 
</li> 
<li>Two 
    <ul> 
     <li>Two-1</li> 
     <li>Two-2</li> 
    </ul> 
</li> 

Utilisation de la jQuery suivante:

$("ul li ul").hide(); 

$("ul li").hoverIntent(
    function(){ 
     $(this).children('ul').slideDown('fast'); 
    }, 
    function(){ 
     $(this).children('ul').slideUp('fast'); 
    } 
); 

Qu'est-ce que cela ne se cache tous les ul sous le niveau supérieur ul jusqu'à ce qu'il y ait un survol.

Ce que je voudrais faire est la suivante:

Si un li a class="current" Je voudrais que la structure d'être ouvert jusqu'au point qui est touché en cours. Il permettrait toujours à l'ul ci-dessous d'être affiché sur un vol stationnaire, ainsi que tous les autres ul, mais à aucun moment les parents de class="current" ne seraient cachés.

Suggestions? Ce problème m'a rendu fou.

Merci!

Répondre

2

Cela devrait être tout ce dont vous avez besoin:

$("ul li:not(:has(li.current))") 
    .find("ul").hide().end() // Hide all other ULs 
    .hoverIntent(
     function(){ 
      $(this).children('ul').slideDown('fast'); 
     }, 
     function(){ 
      $(this).children('ul').slideUp('fast'); 
     } 
    ); 

Cela permet de garder la fonctionnalité de vol stationnaire d'appliquer à tout LI qui a un li.current comme un enfant. (En utilisant le survol au lieu de hoverIntent pour faciliter la démo).

+0

C'est génial! Je vous remercie. :) – kylex

0

il suffit de changer votre appel hoverIntent à ce qui suit:

$("ul li").hoverIntent(
    function(){ 
     $(this).children('ul').slideDown('fast'); 
    }, 
    function(){ 
     $(this).children('ul').not($('.current').parents()).slideUp('fast'); 
    } 
); 

post-scriptum Doit mentionner que ma réponse réfs Nick Craver réponse quand you asked this question before. P.P.S. Souhaitez que mon temps de débogage ait été réduit par votre référence à ce poste et ne pas changer le nom de la classe.

+0

désolé 'bout ça! – kylex

Questions connexes