Texte Défilant Continu

1/5 (2 avis)

Snippet vu 15 959 fois - Téléchargée 13 fois

Contenu du snippet

J'en avais besoin, je l'ai cherché, je l'ai pas trouvé ... Alors je l'ai fait :)

Un texte défilant (horizontal ou vertical) en continu style balise Marquee ( Non valide W3C) et même mieux car il n'y a plus le blanc entre chaque passage !

Voir la démonstration : http://www.jlmconsultant.fr/test/defiltexte.php
En situation sur un site : http://lidealduchti.fr




<body>

<div id="defil1" style="z-index:1;position:relative;width:300px;border:1px solid #C0C0C0;overflow:hidden" onmouseover="Pause1();" onmouseout="Defile1();" >
 <div id="contenu1" style="z-index:1;position:relative;white-space:nowrap;display:inline;float:left;padding:5px" >
 123456789 <a href="[http://jlmconsultant.fr]" target="_blank">JLM Consultant</a>
 </div>
</div>

</body>




<script type="text/javascript">

// DEFIL TEXTE HORIZONTAL

var Timer1 ;
var Vitesse1 = 20 ;
var Scroll1 = 0 ;
var P1 = 0 ;
var Intro1 = true ;
var Boucle1 = false ;
// Texte1 peut être renseigné par une variable php
var Texte1 = '123456789 <a href="[http://jlmconsultant.fr]" target="_blank">JLM Consultant</a>' ;
// La séparation entre chaque texte
Texte1 = Texte1 + ' ... ' ;
var Contenu1 = document.getElementById("contenu1") ;
Contenu1.innerHTML = Texte1 ;
var LargC = Contenu1.clientWidth ;
var Defil1 = document.getElementById("defil1") ;
var LargD = Defil1.clientWidth ;
Contenu1.style.left = LargD + "px" ;

function Defile1()
{
 while ( LargC <= LargD )
 {
 Texte1 += Texte1 ;
 Contenu1.innerHTML += Texte1 ;
 LargC = Contenu1.clientWidth ;
 }
 if ( P1 == 0 )
 {
 Contenu1.innerHTML += Texte1 ;
 P1 = 1 ;
 }
Scroll1++ ; 
 if ( Intro1 == true && Scroll1 == LargD )
 {
 Scroll1 = 0 ;
 Contenu1.style.left = 0 + 'px' ;
 Intro1 = false ;
 Boucle1 = true ;
 }
 if ( Boucle1 == true && Scroll1 == LargC-10 ) // -10 compense le padding de 5px du div contenu1
 {
 Scroll1 = 0 ;
 Contenu1.style.left = 0 + 'px' ;
 }
Contenu1.style.left = ( Contenu1.offsetLeft - 1 ) + 'px' ;
Timer1 = setTimeout('Defile1()', Vitesse1) ;
}

function Pause1()
{
clearTimeout(Timer1) ; 
}

</script>

A voir également

Ajouter un commentaire Commentaires
NHenry
Messages postés
14923
Date d'inscription
vendredi 14 mars 2003
Statut
Modérateur
Dernière intervention
12 mai 2022
162
1 mars 2015 à 19:39
Comme précisé dans la description de la source, la balise marquee est dépréciée et sera bientôt retirée des navigateurs.
mik226
Messages postés
5
Date d'inscription
jeudi 7 novembre 2013
Statut
Membre
Dernière intervention
1 mars 2015

1 mars 2015 à 18:49
ou sinon tu utilise la balise marquee de l'html préhistorique ca marche aussi

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.