JavaScript & amp; IE7 - Pourquoi mon * .onload = function () {} ne se déclenche-t-il pas?

Question

J'ai codé rapidement une galerie pour un petit site, qui fonctionne bien sous Firefox 3 et Safari 3. Mais lorsque je teste mon ancien meilleur ami IE7, il ne semble pas déclencher le fichier imageVar.onload = function () {// code here} .. que je souhaite utiliser pour arrêter l'effet de chargement et charger l'image.

S'il vous plaît gardez à l'esprit ...

• Je sais que les vignettes ne sont qu'une version réduite des images plus grandes. Une fois les images finalisées par le client, je vais créer les vignettes appropriées.
• C’est la première fois que je tente d’essayer de sortir du code JavaScript procédural pour la plupart .. alors allez-y doucement et laissez-moi savoir si mon code est nul!

Answer 1

Pour utiliser avec succès Image.onload, vous devez enregistrer la méthode du gestionnaire d'événements avant de définir l'attribut src.

Informations connexes sur cette question:

rappel Javascript pour l'image en cours de chargement

Answer 2

La prise en charge des événements inter-navigateurs n’est pas aussi simple en raison des différences de mise en œuvre. Puisque vous utilisez jQuery sur votre site, il est préférable d’utiliser ses méthodes d’événements pour normaliser la prise en charge du navigateur:

au lieu de:

 window.load = function(){ 
      //actions to be performed on window load
 }

 imageViewer.image.onload = function(){ 
     //actions to be performed on image load
 }

Faites:

$(window).load(function(){ 
    //actions to be performed on window load
});

 $(imageViewer.image).load(function(){ 
      //actions to be performed on image load
 });

Answer 3

Pour ajouter à la suggestion d'Eran d'utiliser les gestionnaires d'événements intégrés de jQuery, vous pouvez exécuter du code lorsque le document est chargé et que le DOM est créé, mais avant que les images ne soient téléchargées avec:

$(document).ready(function(){
   //your code
});