Jquery Hover problème

voix
0

J'ai un élément qui a une méthode de vol stationnaire attaché, et lorsque vous passez la souris, il affiche un autre div sur elle ... malheureusement une fois que les écrans div supérieures, il les actions refait (depuis que j'ajouté la même classe pour qu'elle fait coller autour)

$(document).ready(function(){

    $(.cartHover).hover(
      function () {
        $(#uniquename4).fadeIn();
      }, 
      function () {
        $(#uniquename4).fadeOut();
      }
    );
  });

Et donc j'ai <div class=cartHover>que sur les écrans de vol stationnaire , <div id=uniquename4 class=cartHover>mais il ne deux fois la fadeIn. Aidez-moi, s'il vous plaît!

Créé 16/09/2009 à 23:44
source utilisateur
Dans d'autres langues...                            


3 réponses

voix
2

Si vous ne voulez pas la queue d'animation pour empiler sur vous, vous aurez besoin d'inclure un .stop () là aussi:

$(function(){
  $('.cartHover').mouseenter(function(){
    $(this).find('.showMe').stop().show();
  }).mouseleave(function(){
    $(this).find('.showMe').stop().hide();
  });
});
Créé 27/01/2012 à 20:51
source utilisateur

voix
2

Alors, ne serait-il préférable d'avoir:

CSS

<div id="someID" class="cartHover">
  <div id="someId" class="showMe">
  </div>
</div>

<div id="someID" class="cartHover">
  <div id="someId" class="showMe">
  </div>
</div>

jQuery

$(function(){
  $('.cartHover').mouseenter(function(){
    $(this).find('.showMe').show();
  }).mouseleave(function(){
    $(this).find('.showMe').hide();
  });
});
Créé 17/09/2009 à 00:02
source utilisateur

voix
1

La réponse est simple. Regardez ce que vous faites ici. Vous avez deux divs avec la classe, cartHover. Ainsi, en vol stationnaire le premier div, provoque # uniquename4 à afficher. Une fois uniquename4 est affiché, si vous passez la souris, il ts va se fanent à nouveau. Il a tout à voir avec votre sélecteur, vous lier l'événement en vol stationnaire à tous les cas d'éléments avec la cartHover de classe - cette sélection comprend à la fois la div qui est par défaut visible et # uniquename4 qui figure sur le vol stationnaire. Je suggère quelque chose comme:

<div id="showSomething" class="cart-class">Content</div>
<div id="toBeShown" class="cart-class">Content</div>

$(document).ready(function() {
    $('#showSomething').hover(
         function() {
            $('#toBeShown').fadeIn();
         },
         function() {
             $('#toBeShown').fadeOut();
         }
     );
});
Créé 17/09/2009 à 00:05
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more