Resize Jquery d'un slider qui bug sous chrome et safari...

Bonjour,

Je vient de développer le nouveau site web pour l'agence dans laquelle je travail, infra-red.
Une fois que nous l'avons tester sous différents navigateurs et différentes résolutions, nous avons dû opérer quelques changements.
La principale modification est un script qui permet de redimensionner le slider de la page d'accueil pour les "petites" résolutions afin d'avoir un meilleur affichage et surtout un accès au contenu plus direct.

Sous firefox, tout fonctionne correctement mais pas avec chrome et safari.
Lors du changement d'image du slide, l'image qui arrive garde sa taille d'origine alors qu'elle devrait être redimensionnée.

Voici le script jquery :

$(document).ready(function() {

 function imageresize() {
 var contentwidth = $('html').width();
 if ((contentwidth) < '1400'){
	 $( ".resizeme" ).aeImageResize({ height: 400, width: 650 });
	 
	 $('.beeCodes-general-frame').css({"width":"650px"});
	 $('.beeCodes-general-frame').css({"height":"303px"});
	 
	 $('.beeCodes-slider').css({"width":"650px"});
	 $('.beeCodes-slider').css({"height":"303px"});
	 
	 $('.beeCodes-hover-2').css({"width":"650px"});
	 $('.beeCodes-hover-2').css({"height":"303px"});
	 
	 $('.beeCodes-content-scroll').css({"width":"650px"});
	 $('.beeCodes-content-scroll').css({"height":"303px"});
	 
	 $('.beeCodes-slider-item').css({"width":"1610px"});
	 $('.beeCodes-slider-item').css({"margin-left":"-805px"});
	 
	 $('.beeCodes-slider-frame-in').css({"width":"650px"});
	 	 
	 $('.link-hide').css({"width":"650px"});
	 $('.link-hide').css({"height":"303px"});
	 
	 /*$('.beeCodes-left-frame').css({"padding-right":"350px"});
	 $('.beeCodes-right-frame').css({"padding-left":"350px"});*/
 } 
 }

 imageresize();//Triggers when document first loads    

 $(window).bind("resize", function(){//Adjusts image when browser resized
 imageresize();
 });

 });

Et le code où on cible l'image :

 $_slider_image .= '<img src="'. $thumbnail[0] .'" width="'. $thumbnail[1] .'" height="'. $thumbnail[2] .'" class="resizeme" >';

Normalement, lors du changement, l'image qui vient se mettre dans la variable $_slider_image devrait être mise à la taille demandé...
Vous pouvez faire le test sous firefox et chrome pour voir le résultat.

Il y a d'autres parties de code et d'autres fichiers qui entre peut-être en compte mais ceux-la sont au dessus de mes compétences et cela ne me permet pas de cibler le problème.

Merci d'avance pour l'aide

Une petite nouveauté en ce qui concerne le problème.

Après plusieurs essais, on c'est rendu compte que lorsque l'on allait sur une autre page puis que l'on revenait sur celle du slider (ou simplement cliquer à nouveau sur le lien vers la page), tout fonctionnait correctement...
Alors que lors de la première visite, cela bug.
Et cela ne marche pas non plus lorsque l'on rafraichit la page, il faut absolument cliquer sur le lien du menu.

Serai-ce un problème de chargement du script ou une histoire de cookie ?

Bonjour,

J'ai plus ou moins le même problème, j'ai un slide avec jQuery qui ne fonctionne pas sous Safari et Chrome, quand on recharge la page...par contre si on clique sur le lien, ça fonctionne...

Avez-vous trouvé la solution?

Merci

Bonjour,
Il faut utiliser

$(window).load(function(){});

ou

window.onload = function(){};

Sur Firefox

$(document).ready(function(){});

se lance une fois la page chargée, sur Chrome elle se lance comme dit dans la doc, une fois le document DOM entièrement chargé, et prêt à être parcourus et manipulé.

Ou alors c'est peut-être parce que Firefox télécharge les images avant de charger le DOM contrairement à Chrome.