Auteur
Boris
Boris
Forum » » Le coin des codeurs » » Faire un bloc avec des infos défilantes
Posté : 28 juin 2010 à 12:16 
Je ne passe plus souvent sur npds.org, mais cela dit, je continue régulièrement à travailler avec cet excellent CMS.
Ayant fait un petit script pour Chouettes, je vous en fait également profiter.
Ce script, très simple, est à mettre dans un bloc (testé sous Revolution), et vous permet d'avoir des infos défilantes dans le bloc en question. Egalement, si vous posez la souris sur le bloc, le défilement s'arrête.
Libre à vous de l'utiliser comme bon vous semble.
<div style="overflow: hidden; height: 100px;" id= "defilBloc01" !onmouse!over="clearTimeout(timerDefil01);" !onmouse!out="timerDefil01 = setTimeout('defiler01()', delaiDefil01);">
<div id="defilContent01" style="display: none;">
<!-- Ici, on met le texte qui doit défiler -->
Ici figureront les actualitées
</div>
</div>
<script type="text/!javascript!">
function defiler01() {
offsetDefil01 = offsetDefil01 + 1 ;
if(offsetDefil01 > hauteurDefil01) {
offsetDefil01 = hauteurBoxDefil01*-1;
}
document.getElementById("defilContent01").style.marginTop = (offsetDefil01*-1)+"px";
timerDefil01 = setTimeout('defiler01()', delaiDefil01);
}
document.getElementById("defilContent01").style.display = "block";
hauteurDefil01 = document.getElementById("defilContent01").offsetHeight;
hauteurBoxDefil01 = document.getElementById("defilBloc01").offsetHeight;
offsetDefil01 = hauteurBoxDefil01*-1;
// Pour ajuster la vitesse de défilement
delaiDefil01 = 80;
document.getElementById("defilContent01").style.marginTop = hauteurDefil01+"px";
defiler01();
</script>
Réglages :
- le height de la première div détermine la hauteur de la zone d'affichage du bloc. Vous pouvez également ajouter vos propres règles de style ici, ou via une classe CSS.
- La variable delaiDefil01 détermine la vitesse de défilement. Plus c'est petit, plus ça va vite.
Si vous souhaitez avoir 2 blocs défilants ou plus, il suffit de modifier le "01" de chaque variable (fonction defiler01() également) pour le changer en "02", "03", etc...
Le script est sûrement perfectible, mais il a le mérite de fonctionner, et sans bug.
Let's play & enjoy!
PS : Pensez à enlever les points d'exclamations, espaces et " ;" parasites parasites!
Message édité par : Boris / 31-01-2011 23:01
Message édité par : Boris / 31-01-2011 23:02
Cet article provient de NPDS
https://www.npds.org/viewtopic.php?topic=24876&forum=5