Discussion :

[laurentSc]

Bonjour,

j'ai un script qui fait défiler les images vers le haut :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<script type="text/javascript">
window.onload=Ini;
//<![CDATA[
var pag=["Aihole","Badami","Belur","Halebid","Hampi","Haveri","Lakkundi","Pattadakal","Somnathpur"];
var tim=50; // temps de pause en millisecondes entre les appels à Nxt
var wIm=160; // largeur en pixels des images
var hIm=120; // hauteur en pixels des images
var dIm=6; // espace en pixels entre les images défilantes
var hZn=600; // hauteur de la zone des images défilantes
var pas=2; // décalage des images à chaque appel à la fonction Nxt
var tmr,nIm=pag.length; // timer et nombre d'images
var hTt=nIm*(hIm+dIm); // hauteur totale des images
var yNx=hIm; // est décrémenté de 'pas' à chaque appel à Nxt
function Nxt() {
var i,y=yNx;
for (i=0; i < nIm; i++){
if (y-hIm <= hZn) document.getElementById('im'+i).style.top=(y-hIm)+'px';
if ((y += hIm+dIm) >= hTt) y -= hTt;
}
if ((yNx -= pas) < 0) yNx += hTt;
}
function Clk(i) { // à remplacer par vos propres 'actions'
switch(i)
{
case 1: window.open('http://www.google.com','_blank');
break;
case 2: window.open('http://www.google.com','_blank');
break;
case 3: window.open('http://www.google.com','_blank');
break;
---
}
}
function Ini() { // dans body, ajustez également la position absolue du div:id='imd'
var i,s='',e=document.getElementById('imd');
for (i=0; i < nIm; i++) s += "<img id='im"+i+"' onclick='Clk("+i+")' title='"+pag[i]
+"' style='position:absolute; left:0px; top:9999px; cursor: pointer;' src='"+pag[i]+".jpg'/>";
e.style.width=wIm+'px'; e.style.height=hZn+'px'; e.innerHTML=s;
tmr=setInterval("Nxt()",tim);
}
//]]>
</script>
<div style="height: 2000px; background-color: rgb(187, 187, 187);">
<div id="imd"
 style="position: absolute; left: 90px; top: 100px; overflow: hidden;"
 onmouseover="clearInterval(tmr)"
 onmouseout='tmr=setInterval("Nxt()",tim)'> </div>
<div style="margin-left: 260px;"><!-- ajustez éventuellement la valeur margin-left -->
<div id="lsN"
 style="width: 160px; height: 110px; background-color: rgb(187, 187, 187); padding-left: 4px; overflow: auto; margin-left: 80px;"></div>
<br />
</div>
</div>

et je ne parviens pas à le modifier pour qu'il défile vers le bas : peut-on m'aider pour ça ?

[SylvainPV]

Pfou ce script est illisible, on dirait une version minifiée. L'auteur est vraiment un sadique. A ta place, je ne me fatiguerai pas à essayer de le modifier, j'en prendrai un autre.

[Invité]

Bonjour,
=> jCarousel
=> ou sa version "light" : jCarouselLite

[laurentSc]

Merci pour les caroussels, mais justement, ce sont des caroussels, alors que ce que je recherche, c'est un défilement d'images sans action de l'utilisateur. Et pour être plus précis, défilement vers le bas (monodirectionnel) et quand la dernière image est passée, la première réapparaît.

[Invité]

Tu manques de curiosité.
Tu aurais pu au moins consulter la documentation.

[laurentSc]

Je préfère finalement utiliser l'outil d'ABCIWEB : il fait ce que je souhaite et y a pas besoin de se plonger dans la doc de jQuery (dont je ne me sortais pas d'ailleurs...)

[laurentSc]

Petite amélioration du script généré par l'outil de ABCIWEB : la fonction existait mais n'était pas utilisée ; sur "onmouseover", le défilement s'arrête, mais sur "onmouseout", il ne repartait pas ; pour cela, j'ai juste remplacé la ligne

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 <div id="conteneur_defil_8"
 onmouseover="DF_ObjetDefilant_Off('objet_defilant_8')">

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 <div id="conteneur_defil_8"
 onmouseover="DF_ObjetDefilant_Off('objet_defilant_8')" onmouseout = "DF_ObjetDefilant_On('objet_defilant_8')">

(la fonction "DF_ObjetDefilant_On" existait mais n'était pas appelée ; ça serait bien de faire cette modif dans l'outil...)