Question

J'expérimente avec des plugins jQuery. J'ai ce code à disparaître dans un « lightbox »:

$('#cleverbox')
    .css({ opacity:0, visibility:'visible' })
    .animate( {opacity:1}, 2000 );

Il fonctionne très bien sur Firefox et Chrome, mais dans IE (7 et 8) et Opera l'élément apparaît juste plutôt que d'être fanée. Il y a un tas de questions similaires sur SO, mais je dois encore trouver une solution qui fonctionne .

Je . Je vais avoir aussi quelques autres problèmes:

  1. Dans Internet Explorer (7 et 8), la première vignette affiche jamais la lightbox (l'événement onload ne se déclenche).
  2. Dans IE7, le code pour corriger le bug de ClearType ne fonctionne pas. $(this).css( 'opacity', '' ) devrait supprimer le style d'opacité (dans ce cas, la propriété « filtre ») mais il ne le supprime pas. Dans les outils de développement de IE, il a encore style="filter: ;"
  3. Dans Opera, il ne court jamais après avoir chargé une fois. En d'autres termes, si une image est dans le cache du navigateur l'événement onload ne se déclenche jamais.
Était-ce utile?

La solution 2

J'ai trouvé un correctif pour le bogue dans Opera, grâce à la communauté Opera. J'ai eu ceci:

var imgLoad = new Image();
imgLoad.src = linkUrl;
imgLoad.onload = function() {
    //do some stuff here
}

Cependant, si l'image est dans le cache du navigateur, il ne se déclenche jamais parce que la partie de chargement est avant que la fonction onload. La solution est de déplacer l'affectation de src sous la fonction onload:

var imgLoad = new Image();
imgLoad.onload = function() {
    //do some stuff here
}
imgLoad.src = linkUrl;

Autres conseils

Avez-vous essayé envelopper des valeurs d'opacité dans ', à savoir $(something).animate({opacity:'1'});? Fonctionne pour moi à chaque fois.

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