Defilement de texte, script js trop gourmand
Bonjour,
Je souhaite faire défiler verticalement un texte, mais sans la balise marquee (non conforme w3c).
J'ai utilisé le code suivant (inséré dans le head):
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
| <script type="text/javascript">
function preload() {
var e = document.getElementById('newsbox');
e.onmouseover = function() { speed = 0; };
e.onmouseout = function() { speed = 2; };
startAnim()
}
var pos;
var speed = 2;
var pos_initial;
function startAnim() {
var e = document.getElementById('newsbox');
pos_initial = e.clientHeight + 10;
pos = pos_initial;
setInterval('anim()', 2);
}
function anim() {
var e = document.getElementById('newslist');
e.style.visibility = 'visible';
e.style.top = Math.floor(pos) + 'px';
pos = pos - speed;
if(pos < -e.clientHeight) pos = pos_initial;
}
// -->
</script> |
La balise body ressemble a ceci :
Code:
<body onload="preload()">
et le code ou le texte doit défiler :
Code:
1
2
3
4
5
6
7
8
9
10
| <div id='newsbox'>
<div id='newslist' style='visibility: hidden'>
<h1>Titre 1</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
<h1>Titre 2</h1>
<p>Tincidunt ut laoreet dolore magna aliquam erat volutpat, ut wisi enim ad minim veniam</p>
<h1>Titre 3</h1>
<p>Quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in.</p>
</div>
</div> |
Evidemment tout fonctionne au poil :ccool:
Certes ... mais ce script a tendance a faire ramer le site. Par ex un clic sur un bete lien hypertexte tout con, le navigateur met bien 1 à 2 secondes pour prendre en compte 8O
Sur des machines peu puissantes, le curseur de la souris saccade 8O8O
Sur ma bécane, ou j'ai un affichage de l'utilisation CPU, j'ai un des cores (sur les deux de mon E6300) qui est utilisé à 100% !!!!
N'étant pas un féru du dev des javascript, puis je solliciter votre aide pour faire la même chose mais en moins gourmand :mouarf: ?
Merci
