fiche-courte/short-product et notre ami IE6

François Lefeuvre
#1 le 01/10/2007 à 11:38
Bonjour,

il est déjas difficile de dompter IE6 en régle générales.

Mais la, sur les short-products c'est la premiére fois que je vois ça.

Pour avoir le résultat escompter il faut réactualisé 3fois.
(c'est marrant mais pas longtemps)

Les a.LinKin ce décalent à droite puis reviennent petit à petit quand on réactualise la page.(f5)

C'est un effet intéractif mais qui va vite saouler les internautes.

Je ne vois pas comment faire ?

Ps:Site direct-delta.fr




Sylvain
Avatar
#2 le 01/10/2007 à 14:09
Bonjour,

Tu as mis le lien voir la fiche avant l'image, essaye en inversant l'ordre.

Thomas Hesse
#3 le 02/10/2007 à 11:33
Bonjour,

J'ai déjà eu ce genre de problèmes. D'après mon expérience, ils surviennent parfois quand on utilise des positions absolues, en "inversant" l'ordre naturel des éléments.

La première fois que j'ai eu le problème, il s'agissait pour moi de placer un encadrement en bas à gauche du div "content". Pour ce faire, j'utilise très logiquement un div que je positionne en absolute, puis à bottom:0;left:0. Et bien une fois sur deux, IE6 plaçait l'encadrement en haut plutôt qu'en bas. J'en ai déduit que IE6 faisait le placement de ce div avant d'avoir rempli le "content" et qu'il "oubliait" de le replacer une fois le contenu de "content" affiché.

Il y a donc a priori deux façons de régler le problème. La meilleure, c'est de rétablir d'une façon ou d'une autre l'ordre naturel des éléments. Ce que propose Sylvain peut donc tout à fait fonctionner.

Pour ma part, dans le cas de mon encadrement, ce n'était pas possible, j'ai donc dû recourir à du JavaScript. Le script que j'ai écris est vraiment tout bête : il se déclenche sur l'événement onLoad de la page et réassocie leurs classes aux éléments incriminés, genre : mon_element.className = mon_element.className;

Et ça marche... Cette méthode a cependant deux défauts. Premièrement, elle utilise JS. Bon, les utilisateurs de IE6 désactivent rarement JS. Deuxièmement, si la page est très chargée graphiquement, le onLoad a lieu relativement tard et le problème de mise en page peut être apparent pendant quelques secondes, le temps de finir de charger toutes les images. On peut éventuellement remédier à cet inconvénient avec un onDOMReady plutôt qu'un onLoad, en utilisant un framework JS.

J'utilise ce script sur le site http://desctockmusic.com si vous voulez y jeter un oeil (tout à la fin de la page : /script/placementIE6.js).

Dans votre cas précis, François, je vous recommande chaudement d'essayer avant tout la première méthode, il y a de fortes chances que ça marche.

Bon courage !


Thomas.
Sylvain
Avatar
#4 le 02/10/2007 à 15:54
En général le div container du short product je le met en position relative, et tous les élèments à l'intérieur sont en "absolute", leur position sera donc gérée par rapport au coin haut gauche du short product. Cela marche tres bien sur ie6, ie7 et Firefox.
Ce qui permet également d'avoir une belle présentation, tous les élèments titres, textes, liens et photos sont au mêmes niveaux.
Sylvain
Avatar
#5 le 02/10/2007 à 15:55
Aîe les fautes c'est dommage on ne peut pas éditer son message !
François Lefeuvre
#6 le 04/10/2007 à 11:04
je vais regarder tout celà , merci pour vos conseil.

Actualités Medialibs

Formation collective les 17 et 18...

En savoir plus...

Inscrivez-vous à la formation sur...

Un site e-commerce en Flash

site Quai
En savoir plus...

Découvrez le premier site e-commerce...

Formation collective les 13 et 14...

En savoir plus...

Inscrivez-vous à la formation sur...

Un partenariat avec l'éditeur de...

Logo EBP
En savoir plus...

Medialibs envisage une collaboration...

Bientôt la sortie de la V1.3...

emajine-carre-135
En savoir plus...

Medialibs vous présentera, en début...

Les grands projets

Les API pour les programmeurs

Afin de permettre aux programmeurs d'intégrer plus facilement leurs propres...

Suivre le développement
L'éditeur d'apparences Flash

Véritable innovation, cet éditeur d'apparences vous permet d'intégrer...

Suivre le développement

[Communauté] E-majine

Modification du champ "Case à cocher...

En savoir plus...

Une nouvelle option "Nombre maximum...

Les catégories de l'annuaire côté...

En savoir plus...

Les catégories de l'annuaire sont...

[Communauté] Izi-Media

Des nouvelles chartes graphiques pour...

En savoir plus...

Trois nouvelles chartes graphiques...

Sortie - Nouvelle version d'Izi-Media

En savoir plus...

La nouvelle version d'Izi média est...