Smettere di jQuery animazione prematuramente

Question

Sto cercando di fadeIn e fadeOut una png trasparente utilizzando jQuery. Certo, sembra chiazza di petrolio in Firefox, ma significativamente meno che accettabile in IE (7 e 8). Si tratta di un bug noto con IE, e purtroppo non sembra essere molto più di una soluzione.

Fondamentalmente quello che sto facendo è posto un rettangolo bianco semi-trasparente su un'immagine per rendere l'immagine appare 'in background'. Io voglio fare questo senza intoppi, ed è lì che fadeIn entra in gioco. A causa del bug di IE, tuttavia, sono stato costretto a fadeIn un rettangolo bianco completamente opaco sull'immagine, invece, che lo rende purtroppo scomparire. Mentre questo sembra significativamente migliore ed è quasi quello che sto cercando, non è ancora accettabile. L'utente deve essere in grado di vedere qualche immagine sulla pagina, anche se sullo sfondo.

Quindi la mia domanda è questa:

C'è un modo per fermare la funzione fadeIn (o qualsiasi animazione jQuery, in realtà), dopo l'animazione per il 75% del suo tempo di animazione previsto?

Questo lascerebbe la mia immagine 75% mescolato il rettangolo bianco, e non vorrei avere a che fare con il brutto bug png trasparente di IE.

Grazie!

Answer 1

Si potrebbe utilizzare un'immagine opaca e solo animare l'opacità al 75%.

  $('#overlay').animate({
    opacity: 0.75
  }, 5000, function() {
    // Animation complete.
  });

Answer 2

Invece di fadeIn / fadeOut, utilizzare il animato funzione per animare la proprietà Opacità al tuo desiderato livello.

Answer 3

È anche possibile utilizzare la funzione fadeTo .

Questa è la synthax:

.fadeTo( duration, opacity, [ callback ] )

Answer 4

negativa per la vostra situazione, ma ecco la risposta reale alla tua domanda come ha chiesto: -)

.stop( [ clearQueue ], [ jumpToEnd ] )

  

Quando .Stop () viene chiamato su un elemento,   l'animazione attualmente in esecuzione (se   esistente) viene immediatamente interrotta. Se, per   esempio, un elemento viene nascosta   con .slideUp () quando .Stop () è   chiamato, l'elemento sarà ora ancora   visualizzato, ma sarà una frazione di   la precedente altezza. Richiama   le funzioni non sono chiamati.

http://api.jquery.com/stop/