Problème jQuery: hover, un-hover ne fonctionne pas

Question

J'ai un problème. Ceci est mon site Web http://keironlowe.x10hosting.com/ Les lignes rouges qui se déplacent dans la barre de navigation sont dues à ce code ci-dessous. Mais cela ne fonctionne pas comme prévu. Ce que je veux, c'est que les lignes rouges s'allongent en vol stationnaire. Mais revenez à la taille normale lorsque vous déplacez le curseur, mais cela ne fonctionne pas correctement, il ne fonctionne qu'une seule fois, puis vous devez actualiser, et il ne fonctionne pas sur le lien d'accueil et il devient plus petit au lieu de plus. Aidez-moi?

<script type="text/javascript" src="jQuery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$('div', '#nav_container').hover(function() { 
    $(this).animate({width: '220px'}, 1000);  
}, function() { 
    $(this).animate({width: '300px'}, 1000); 
}); 
}); 
</script> 

Answer 1

Essayez d'appeler .stop() avant Animer:

$(document).ready(function() { 
    $('div', '#nav_container').hover(function() { 
    $(this).stop(); 
    $(this).animate({width: '220px'}, 1000);  
    }, function() { 
    $(this).stop(); 
    $(this).animate({width: '300px'}, 1000); 
    }); 
}); 

EDIT: Si vous voulez redimensionner l'image au lieu de la DIV où elle est contenue. Essayez ceci:

$(document).ready(function() { 
    $('#nav_container div').hover(function() { 
     $(this).children('img').stop().animate({width: '220px'}, 1000);  
    }, function() { 
     $(this).children('img').stop().animate({width: '300px'}, 1000); 
    }); 
}); 

Vous devrez peut-être ajuster les largeurs et la durée pour obtenir l'effet désiré.

Answer 2

sa fixation facile.

écrire ce qui suit dans la balise de script:

$(document).ready(function() { 
     $('.box').hover(
      function() { 
       $(this).css({ background: 'blue' }); 
      }, 
      function() { 
       $(this).css({ background: 'black' }); 
      } 
     ); 
    }); 

et écrire la marque suivante et vous devez avoir votre vol stationnaire en souriant à vous

<div class="box"></div> 

Answer 3

oops oublié de mentionner; écrit plusieurs sélecteurs en jquery est comme

('sélecteur1, sélecteur2, ...)

que vous avez avez tort écrit comme:

$ ('div', '#nav_container'). vol stationnaire (function() {....

espérons que cette aide