Question

Je suis en train de fadeIn et fadeOut un .png transparent en utilisant JQuery. Bien sûr, il semble lisse dans Firefox, mais nettement moins acceptable dans IE (7 et 8). Il est un bug connu avec IE, et, malheureusement, il ne semble pas être beaucoup d'une solution de contournement.

En fait ce que je fais est place un rectangle blanc semi-transparent sur une image pour faire apparaître l'image "en arrière-plan. Je veux le faire en douceur, et c'est là fadeIn entre en jeu. En raison du bug IE, cependant, j'ai été forcé de fadeIn un rectangle blanc complètement opaque sur l'image à la place, faire disparaître, malheureusement. Bien que cela semble beaucoup mieux et est presque ce que je suis à la recherche, il est toujours pas acceptable. L'utilisateur doit être en mesure de voir l'image sur la page, mais en arrière-plan.

Alors ma question est la suivante:

Y at-il un moyen d'arrêter la fonction fadeIn (ou toute animation jquery, vraiment) après animant 75% de son temps d'animation prévue?

Ceci laisserait mon image 75% mélangé le rectangle blanc, et je ne serais pas à traiter avec méchant bug png transparent IE.

Merci!

Était-ce utile?

La solution

Vous pouvez utiliser une image opaque et juste animer son opacité à 75%.

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

Autres conseils

Au lieu de fadeIn / fadeOut, utilisez le Animer fonction pour animer la propriété d'opacité à votre choix niveau.

Vous pouvez également utiliser la fonction fadeTo .

Ceci est la synthaxe:

.fadeTo( duration, opacity, [ callback ] )

Non recommandé pour votre situation, mais voici la réponse réelle à votre question posée: -)

.stop( [ clearQueue ], [ jumpToEnd ] )
  

Lorsque .stop () est appelée sur un élément,   l'animation actuellement en cours d'exécution (si   tout) est immédiatement arrêté. Si, pour   exemple, est un élément caché   avec .slideUp () lorsque .stop () est   appelé, l'élément sera maintenant encore   affiché, mais sera une fraction de   sa hauteur précédente. Rappeler   les fonctions ne sont pas appelés.

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

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top