Jquery animate fond du problème

C'est étrange.
J'ai une animation qui démarre lorsque j' .passez la souris sur un DIV.
Dans cette div, j'ai un autre dans la position absolue que je veux déplacer vers le haut jusqu'à ce que la souris rester sur la div principale et descendre dans votre position quand je sors de la div principale. Un simple effet hover.
Je dois écrire cette fonction qui fonctionnent bien à part un bug étrange.

         var inside = $('.inside')

         inside.hover(function() {
             $(this).children(".coll_base").stop().animate({
               bottom:'+=30px'
             },"slow")
          }, function() {
             $(this).children(".coll_base").stop().animate({
               bottom:'-=30px'
             },"slow");
          });

j'ai besoin de +=30 et -=30 parce que je dois appliquer cette fonction à une gamme de div avec différents bas.
Le problème est que si je hover sur et en dehors de la div DIV animer droit, mais quand se calmer, il baisse la valeur de la partie inférieure de chaque animation. Si je vais en haut et en bas de la div principale, je vois que l'animation div aller vers le bas, même au-delà de la div principale.
Je pense que je manque quelque chose pour résoudre ce bug.
Merci pour toute aide

OriginalL'auteur andrea | 2010-06-06

  1. 5

    Si le bottom n'est pas 0 d'abord, puis vous pouvez stocker la première valeur du bas, et l'utilisation que dans la seconde fonction. (Si le premier bottom est 0, puis il suffit de l'utiliser.)

    Dans l'exemple ci-dessous, la première bottom position est stockée à l'aide de la data() attribut pour inside, puis il est extrait dans le second gestionnaire de revenir à la position initiale.

    Live exemple: http://jsfiddle.net/VAsZZ/

    var inside = $('.inside');

inside.hover(
    function() {
        if(!inside.data('bottom')) {
            inside.data('bottom',$(this).children(".coll_base").css('bottom'));
        }
        $(this).children(".coll_base").stop().animate({ bottom:'+=30px' },"slow")
    }, 
    function() {
        $(this).children(".coll_base").stop().animate({bottom:$(this).data('bottom') },"slow");
    }
);​
    merci!!!! il fonctionne très bien!
    Vous êtes les bienvenus. :o)

    OriginalL'auteur user113716

  2. 0

    Je ne pense pas que vous pouvez utiliser relatif (-=30px et +=30px) les valeurs dans ce cas, l'animation peut s'arrêter à un point arbitraire qui permettra de jeter les animations qui suivent. Mieux vaut faire appel à chacun() sur l'ensemble correspondant, calculer le bon décalages et de transmettre les valeurs directement dans votre hover fonction.

    OriginalL'auteur CurtainDog