NPDS : Gestion de contenu et de communauté
Content & Community Management System (CCMS) robuste, sécurisé, complet, performant, parlant vraiment français, libre (Open-Source) et gratuit.
20 visiteur(s) et 0 membre(s) en ligne.
Autres infos
Activité du Site
Pages vues depuis 25/05/2001 : 109 364 390
- Nb. de membres 8 695
- Nb. d'articles 1 695
- Nb. de forums 26
- Nb. de sujets 8
- Nb. de critiques 92
Index du forum »» Le coin des codeurs »» Faire un bloc avec des infos défilantes
Faire un bloc avec des infos défilantes#24876
2Contributeur(s)
3 Modérateur(s)
Boris
Bonjour à tous,
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. :=!
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! ;-)
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
Boris
Comme NPDS a la mauvaise (ou plutôt la bonne !) tendance à rajouter des ! et des espaces dans le code, j'en ai fait un double sans espace ni ! ici : http://pastebin.com/ib9RMTWp
Servez-vous! :)
Servez-vous! :)