jquery fadein Anschlag

Question

ich habe folgende Skript

 <script>
  $(document).ready(function(){
   $("div.mover").hover(function () {
  $("div.hide1").fadeTo("slow", 0.33);

  $("div.hide1").fadeTo("slow", 1);

},function(){
  $("div.hide1").stop();
});
  });
 </script>

 and html page is

<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
<td><div class="mover"><IMG SRC="images/buttons_full_01.png" ></div></td>
 </tr>
 <tr>
<td><div class="mover"><IMG SRC="images/buttons_full_02.png"></div></td>
 </tr>
<tr>
<td><div class="mover"><IMG SRC="images/buttons_full_03.png"></div></td>
</tr>
</table>

meine Funktion ist es, den Hintergrund auf der Maus über die Taste verblassen

aber das Problem, wenn ich mit der Maus über alle Tasten und nach links Maus der Tasten Animation immer weiter, bis es seine alle Transaktionen beenden.

, was ich will, ist: wie Maus, um die Tasten Animation links kommen           $ ( "Div.hide1") fadeTo ( "langsam", 1). und stoppen

Answer 1

Ihre ursprüngliche Funktion funktioniert gut, solange sich der Mauszeiger über einen zweiten (oder dritten) „mover“ div nicht die Länge gezogen. Wenn das passiert, können Sie mehrere Animationen erhalten wie diese Warteschlange gestellt:

mover1.hover-over()
mover2.hover-over()

In der Standardeinstellung ruft stop beendet nur die aktuelle Animation -. Die Animation für die First-Mover initiiert, nicht die Animation für die zweite Mover Warteschlange

Sie können durch das Löschen des Animations Warteschlange der zusätzliche Animationen nicht ausgeführt werden, wenn Sie anrufen stop , die akzeptiert einen optionalen Parameter clearQueue:

$(document).ready(function(){     
    $("div.mover").hover(function () {
        $("div.hide1").fadeTo("slow", 0.33).fadeTo("slow", 1);
    }, function(){
        // Added stop parameters and added an additional fadeTo,
        // to make sure we get back to 100% opacity.
        $("div.hide1").stop(true).fadeTo("slow", 1);
    });
});