Défilement d'images avec différents navigateurs

Version imprimable

Bonjour,

j'ai mis un script avec marquee pour un défilement de 12 images qui démarre en javascript

le script marche bien sur i.e 9 mais pas sur chrome car il n'y a que 4 images sur 12 qui défilent

quelqu'un saurait-il comment s'en sortir ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<marquee align="center" height="200"  scrolldelay="5" scrollamount="5" onmouseout="this.start()" onmouseover="this.stop()">
 
<p>
 
<img border="0" src="images/artistes/Adele.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/AmyWinehouse.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/BritneySpears.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/CelineDion.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/ElvisPresley.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/JamesBlunt.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/jenniferlopez.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/KatyPerry.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/LadyGaga.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/Madonna.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/MariaCarey.jpg" alt="" hspace="0">
<img border="0" src="images/artistes/Rihanna.jpg" alt="" hspace="0">
 
</p>
</marquee>

08/10/2012, 10h58
Kaamo

Bonjour,

Pas de soucis de mon coté (avec mes images). Es-tu sûr du chemin ? Sont-elles toutes disponibles dans ton répertoire images/artistes ?

Sinon, un peu de sensibilisation :

hspace est dépréciée. Il est conseillé de la remplacer par du CSS :

Code:

<img style="margin: 0px 0px">

Pourquoi utiliser hspace dans ton cas d'ailleurs ? Cet attribut permet de mettre une marge à gauche et à droite de l'image mais, de base, tu n'as pas de marge donc mettre hspace=0 ne sert à rien.

Idem pour le border=0 : De base, il n'y a pas de bordure sauf pour les images contenues dans les balises <a>.

Enfin, la balise marquee, bien qu'elle soit supportée par les navigateurs, n'est pas conseillée non plus car elle est propriétaire de Microsoft (c'est une balise non standard qui n'a jamais été validée par le W3C). Plusieurs solutions de remplacement :

- utiliser du CSS3 (ok ce n'est pas encore compatible partout mais ça le deviendra => une piste)
- utiliser un script javascript qui permet de faire défiler des élements (le net regorge d'exemple.)
08/10/2012, 13h32
devyan

Bonjour,

Si cela ne marche toujours pas essaye d'ajouter 'white-space:nowrap' pour empêcher le retour à la ligne si tes images sont séparées par des espaces ou retours à la ligne dans ton code HTML.

devyan
08/10/2012, 16h16
monlou

merci pour vos réponses
j'ai tout essayé vos suggestions mais toujours pareil

marche tres bien avec explorer
4 images sur 12 avec chrome

Kaamo

Citation:

utiliser un script javascript qui permet de faire défiler des élements (le net regorge d'exemple.)

oui j'y ai pensé mais sont pas toujours fonctionnel et pratique . faut savoir choisir parmi tout cet éventail de téléchargement de script sur son site.

editer: je viens de me rendre compte que si j'enleve la hauteur au debut de la balise marquee, les images se défilent a raison de 4 images sur 3 lignes sur chrome ce qui est étonnant non ?

Code:

<marquee align="center" scrolldelay="5" scrollamount="5" onmouseout="this.start()" onmouseover="this.stop()">
09/10/2012, 11h18
Kaamo

ça dépend de la taille des images. Elles font toutes la même dimension ?
10/10/2012, 02h51
monlou

oui elles sont toutes de la memes tailles mais avec quelques différences en résolution.

je vais prendre le temps de les redimensionner en plus petites pour voir l'effet que ca apportera. peut-etre qu'au lieu d'afficher 4 photos sur 3 lignes, je réussirai tout de moins a afficher 6 photos sur 2 lignes.

et je posterai le résultat ici
10/10/2012, 09h58
devyan

Citation:

Envoyé par monlou

merci pour vos réponses
j'ai tout essayé vos suggestions mais toujours pareil

marche tres bien avec explorer
4 images sur 12 avec chrome

Kaamo

oui j'y ai pensé mais sont pas toujours fonctionnel et pratique . faut savoir choisir parmi tout cet éventail de téléchargement de script sur son site.

editer: je viens de me rendre compte que si j'enleve la hauteur au debut de la balise marquee, les images se défilent a raison de 4 images sur 3 lignes sur chrome ce qui est étonnant non ?

Code:

<marquee align="center" scrolldelay="5" scrollamount="5" onmouseout="this.start()" onmouseover="this.stop()">

C'est pour ce genre de chose que je t'ai suggéré plus tôt d'ajouter la clause CSS "white-space:nowrap" dans le conteneur des images afin de lui demander de ne pas passer à la ligne.
Par contre il faut laisser la largeur "libre".

devyan