jquery .load () ne fonctionne pas après une actualisation complète

J’ai un code qui lorsque la page charge obtient la hauteur d’une image et redimensionne ensuite son div conteneur en conséquence. Cela fonctionne correctement sauf si c’est la première fois que la page est chargée ou si je fais une actualisation complète avec ctrl + f5, cela ne fonctionne pas. J’ai essayé d’utiliser

$('#div img').load(function() { // put the code here }); 

Mais j’ai le même problème. quelquun sait pourquoi cela se passe?

Ceci est mon code:

 maxheight = 0; $('#venue #main-img img').each(function() { height = $(this).height(); if(height > maxheight) { maxheight = height; } $(this).hide(); }); $('#venue #main-img').animate({ height: maxheight }); $('#venue #main-img img').first().show(); 

Désolé aurait dû dire. Le code est dans $ (document) .ready ()

Essayez d’appeler votre code dans $(window).load . Cela fonctionnera après le chargement de toutes les images.

 $(window).load(function () { // run code }); 

Ou vous pouvez essayer le plugin imgload .

J’ai eu ce même problème aussi. Après quelques recherches, il semble que le navigateur doit avoir une valeur prédéfinie pour l’image afin de réinitialiser la taille. Donc, lors du chargement initial, cela gâche, mais lors du rechargement, la hauteur de l’image est conservée, le javascript fonctionne alors correctement. Vous devez coder la hauteur initiale de vos images pour que le JS puisse les redimensionner correctement.

Si vos images n’ont pas la largeur / hauteur spécifiée en HTML ou CSS, leur largeur / hauteur n’est connue qu’après le téléchargement des images.

$(document).ready déclenche lorsque le DOM a été chargé, mais potentiellement avant le téléchargement de supports auxiliaires tels que des images. Cela signifie que vous avez potentiellement une largeur / hauteur de 0 lorsque votre navigateur télécharge à nouveau les images.

Peut-être que vous pouvez utiliser quelque chose comme ça . Le plugin “imagesLoaded” en particulier semble utile (bien que son code implique que $(imgs).load aurait dû fonctionner pour vous>. <).

Vous voudrez peut-être essayer ceci à la place:

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

Vous pouvez utiliser un plugin jQuery comme celui-ci https://gist.github.com/797120/b7359a8ba0ab5be298875215d07819fe61f87399