Il fonctionne dans IE6 et FireFox; Mais pour une raison quelconque non dans IE7.
À l'aide d'ASP.NET sur Page_Init, je localise une liste de chapitres qui sont des liens vers l'image dans le livre ainsi qu'un tableau javascript qui contient les ID de la page.
ex.
Chapitre 1 -> href = "javascript: seePage (4);"
Voici le code actuel que j'utilise:
var availablePages = ['1002_001','1002_002','1002_003','1002_004','1002_005']; function seePage(index) { $get('imgSingle').src = 'graphics/loading.gif'; var img = new Image(); img.src = 'get.jpg.aspx?size=single&id=' + availablePages[index]; img.onload = function() { var single = $get('imgSingle'); single.src = img.src; } }
Lorsque je clique sur le chapitre 1, l'image fonctionne bien dans l'ensemble (IE6,7, FF) et en cliquant sur un autre lien de chapitre fonctionne également; Cependant, dans (et seulement dans) IE7 clique sur le même chapitre deux fois (chap1, chap2, puis chap1 à nouveau) l'image est-elle coincée sur l'image 'chargement' … Je retire mes cheveux ici les gars … .
Cela est dû au fait que IE sauvegardera l'image, et l'événement onload ne déclenchera jamais après son chargement.
Vous devez positionner l'événement onload avant le src.
var availablePages = ['1002_001','1002_002','1002_003','1002_004','1002_005']; function seePage(index) { $get('imgSingle').src = 'graphics/loading.gif'; var img = new Image(); img.onload = function() { var single = $get('imgSingle'); single.src = img.src; } img.src = 'get.jpg.aspx?size=single&id=' + availablePages[index]; }
Une autre façon de le faire est de vérifier si l'image est déjà chargée avec image.complete
. Par exemple:
var img = new Image(); img.src = 'foo.jpg'; if(img.complete){ img.onload = function(){ /* ... */ }; } else { /* execute something else, or the same. */ }
J'ai eu ce comportement dans IE6 et 7.