jQuery arrête .animate() de travailler sur la page en cours

Question

Je dois désactiver l'animation/fondu sur un lien ('li') quand c'est la page en cours.

Mon HTML

<div id="hp-navigation-second"> 
<ul> 
    <li class="works current"><a href="javascript:void(0);return false;" title="How it Works"> 
    <h1>How it Works</h1></a></li> 
    <li class="benefits"><a href="member-benefits.html" title="Member Benefits"> 
    <h1>Member Benefits</h1></a></li> 
    <li class="start"><a href="get-started.html" title="Become a member"> 
    <h1>Become a Member</h1></a></li> 
    <li class="tours"><a href="tour.html" title="Take a tour"> 
    <h1>Take a Tour</h1></a></li>    
</ul> 

Mon jQuery

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#hp-navigation-second li").hover(function() { 
     $(this).stop().animate({"backgroundColor":"#0E5B89"}, "medium"); 
    },function() { 
     $(this).stop().animate({"backgroundColor":"#a6a6a6"}, "slow"); 
    }); 
}); 
</script> 

Answer 1

Si je comprends ce que vous vous demandez: vous ne voulez pas lancer l'animation si la LI question a le nom de classe css "actuel".

Vous pouvez utiliser la méthode .pas() pour filtrer le noeud courant (comme ci-dessous). $ ("# hp-navigation deuxième li") non ("courant") Vous

pourrait également utiliser le: non Selector directement: $ ("# hp-navigation seconde li: non (.current)")

Voici un exemple de la première:

$(document).ready(function() { 
$("#hp-navigation-second li").not(".current").hover(function() {  
    $(this).stop().animate({"backgroundColor":"#0E5B89"}, "medium"); },function() { 
    $(this).stop().animate({"backgroundColor":"#a6a6a6"}, "slow"); 
}); 
}); 

Answer 2

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#hp-navigation-second li").hover(function() { 
     var $this = $(this), 
      $a = $this.find("a"); 

     if ($a.attr("href") !== window.location.href) { 
      $this.stop().animate({"backgroundColor":"#0E5B89"}, "medium"); 
     } 
    },function() { 
     var $this = $(this), 
      $a = $this.find("a"); 

     if ($a.attr("href") !== window.location.href) { 
      $this.stop().animate({"backgroundColor":"#a6a6a6"}, "slow"); 
     } 
    }); 
}); 
</script>