problème avec la balise marquee
Bonjour à tous,
voilà j'ai découvert très récemment la balise "marquee" et je trouve ça très bien. Seulement j'aimerai bien faire quelque chose avec mais je n'arrive pas.
j'ai un texte géneré dynamiquement et je voudrais le faire défiler (cf code en exemple).
J'ai donc utilisé la balise marquee et j'ai mis mon texte dedans. Jusque là ok ça défile.
Je voudrais maintenant que le texte défile uniquement lorsque je suis sur les fleches gauche ou droite.
j'ai fait une fonction javascript, et jusque là ok ça marche.
là j'ai 2 problèmes :
- je voudrais que mon texte soit affiché dès le départ (car là il est masqué et il s'affiche qu'à partir du moment où je lance le défilement)
j'ai essayé avec ce code :
Code:
1
2
3
4
5
| marquee div{
background-color:blue;
margin-left:-490px;
display:inline;
} |
et ça marche que sous ie !! quelqu'un sait pkoi ?
- je voudrais que mon texte s'arrete de défiler juste à la fin du texte, est-ce possible ?
voici mon code (y a juste à copier-coller dans un fichier pour tester)
Code:
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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
table {
width:600px;
height:20px;
text-align:center;
}
table td{
border:1px solid black
}
marquee{
width:500px;
}
marquee div{
background-color:blue;
display:inline;
}
#cellMiddle{
width:500px;
}
</style>
<script language="JavaScript1.2" type="text/javascript">
var marquise = null;
function stopScroll()
{
marquise.stop();
marquise.scrollAmount=0;
}
function startScroll()
{
marquise.start();
marquise.scrollAmount=5;
}
function leftScroll()
{
marquise.direction="left";
}
function rightScroll()
{
marquise.direction='right';
}
</script>
</head>
<body>
<table cellpadding="0" cellspacing="0" align="center">
<tr>
<td valign="middle">
<a href="#"
onmouseover="rightScroll();startScroll();"
onmouseout="stopScroll()" >
<<
</a>
</td>
<td id="cellMiddle" valign="middle">
<span class="gen">
<marquee style="" id="marquise" scrollamount="3" direction="left" height="20">
<nobr>
<div>
<font color="red" size="10">test1 |</font>
<font color="red" size="10">test2 |</font>
<font color="red" size="10">test3 |</font>
<font color="red" size="10">test4 |</font>
<font color="red" size="10">test5</font>
</div>
</nobr>
</marquee>
</span>
</td>
<td valign="middle" >
<a href="#"
onmouseover="leftScroll();startScroll();"
onmouseout="stopScroll()" >
>>
</a>
</td>
</tr>
</table>
<script language="JavaScript1.2" type="text/javascript">
marquise = document.getElementById('marquise');
stopScroll();
</script>
</body>
</html> |
Merci à ceux qui pourront ou essayeront de m'aider.
