Discussion :

[Phiss]

Bonjour,

Comme je le dis dans le sujet de mon post, j'ai une application qui affiche des br�ves dans une div et ces br�ves tournent en d�filant.

Voici le code source.

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
54
55
56
57
58
59
60
61
62
63
64
65
66
<!-- DEBUT DU SCRIPT -->
 
<script language="JavaScript"> 
scroll_message = new Array;
scroll_message[0]='<strong>test1:</strong> 11:03:45 - Voici un message bref. Comment va t on le gérer? ';
scroll_message[1]='<strong>test2:</strong> 11:04:01 - Et celui la? ';
scroll_message[2]='<strong>test1:</strong> 11:04:20 - Troisieme ';
scroll_message[3]='<strong>test4:</strong> 11:04:52 - Quatrieme membre, quatrieme message. Logique non? ';
scroll_message[4]='<strong>test3:</strong> 11:05:10 - encore un autre ';
 
function d(texte)
	{
	document.write(texte);
	}
 
d('<DIV ID="scroll_relativ">');
d('<DIV ID="scroll_cadre">');
d('<div id="scroller_1">'+scroll_message[0]+'</DIV>');
d('<div id="scroller_2">'+scroll_message[1]+'</DIV>');
d('</DIV></DIV>');
scroll_mode =1;
scroll_actuel = 0;
function scroll_start()
	{
	if(scroll_mode == 1)
		{
		scroller_haut = "scroller_1";
		scroller_bas = "scroller_2";
		scroll_mode = 0;
		}
	else
		{
		scroller_bas = "scroller_1";
		scroller_haut = "scroller_2";
		scroll_mode = 1;
		}
	scroll_nb_message = scroll_message.length-1;
	if(scroll_actuel == scroll_nb_message)
		scroll_suivant = 0;
	else
		scroll_suivant = scroll_actuel+1;
	if(document.getElementById)
		document.getElementById(scroller_bas).innerHTML = scroll_message[scroll_suivant];
	scroll_top = 0;
	if(document.getElementById)
		setTimeout("scroll_action()",750)
	}
 
function scroll_action()
	{
	scroll_top -= 1;
	document.getElementById(scroller_haut).style.top = scroll_top;
	document.getElementById(scroller_bas).style.top = scroll_top+80;
	if((scroll_top+80) > 0)
		setTimeout("scroll_action()",10)
	else
		scroll_stop()
	}
 
function scroll_stop()
	{
	scroll_actuel = scroll_suivant;
	scroll_start()
	}
window.onload = scroll_start;
</SCRIPT>

Pour les styles voici le code

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
#scroll_relativ
{
position:relative;
width:200px;
height:80px;
background-color:#b3b3b3;
}
#scroll_cadre
{
position:absolute;
width:192px;
height:72px;
top:4px;
left:4px;
clip:rect(0 192 72 0);
}
 
#scroller_1
{
position:absolute;
width:192px;
left:0px;
top:0px;
font-size:11px;
font-family:Verdana;
color:#000000;
text-decoration:none;
}
 
#scroller_2
{
position:absolute;
width:192px;
left:0pt;
top:100pt;
font-size:11px;
font-family:Verdana;
color:#000000;
text-decoration:none;
}

Donc pour r�sum�, sous IE et Op�ra le script fonctionne bien. Les 5 br�ves tournent en continu et d�filent normalement.
Sous Firefox, Safari et Chrome, les br�ves sont afficher les unes sur les autres (2 par deux) et ne d�filent pas.

J'ai l'impression que la commande qui d�finit le point top des div scroller ne marche pas correctement.

Avez vous une id�e?

Merci.

[Phiss]

J'ai remarqu� que le bout de code marchait tr�s bien si je le mettais seul sur une page.
Il doit y avoir un conflit avec d'autres scripts sur la page.
Je vais faire le tour.
Si j'ai d'autres questions je rouvrirais le post.

[Phiss]

Pour info j'ai r�solu le probl�me en ajoutant

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

+"px"

sur les lignes

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
	document.getElementById(scroller_haut).style.top = scroll_top;
	document.getElementById(scroller_bas).style.top = scroll_top+80;

car la propri�t� top demande une unit� de mesure.
Cela donne donc

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
	document.getElementById(scroller_haut).style.top = scroll_top+"px";
	document.getElementById(scroller_bas).style.top = scroll_top+80+"px";