Texte défilant

Publié le par Titia

Pour faire défiler un texte, il faut utiliser la balise <marquee/>.
<marquee>J'inscris ici mon texte défilant grâce à la balise <marquee/>... </marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


Ici, le texte défile toujours de gauche à droite. Vous pouvez aussi le faire alterner en ajoutant l'attribut behavior="alternate".
<marquee behavior="alternate">J'inscris ici mon texte défilant grâce à la balise </marquee>... </marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


Si le sens du défilement ne vous plaît pas, on peut ajouter l'attribut direction, qui prend pour valeur right, left, up ou down.
<marquee direction="right">J'inscris ici mon texte défilant grâce à la balise <marquee/>... </marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...



<marquee  height="50px" direction="up">J'inscris ici mon texte défilant grâce à la balise <marquee/>... </marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


On peut aussi changer la hauteur ou la largeur, avec les attributs height et width.
<marquee width="150px">J'inscris ici mon texte défilant grâce à la balise <marquee/>... </marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


On peut aussi déterminer de combien le texte va avancer. C'est l'attribut scrollamount. Et la vitesse du déplacement : scrolldelay. En jouant sur ces deux valeurs, on peut faire défiler lentement :
<marquee scrollamount="1" scrolldelay="500">J'inscris ici mon texte défilant grâce à la balise <marquee/>...</marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


plus rapidement
<marquee scrollamount="10" scrolldelay="1">J'inscris ici mon texte défilant grâce à la balise <marquee/>...</marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


On peut aussi faire avancer par saccades
<marquee scrollamount="50" scrolldelay="500">J'inscris ici mon texte défilant grâce à la balise <marquee/>...</marquee>

J'inscris ici mon texte défilant grâce à la balise </marquee>...


Et bien sûr, on peut changer la taille, la police... enfin la totale, quoi... Pour cela, dans la balise <marquee/>, on ajoute la balise <span/> avec tous les attributs de style souhaités.
<marquee><span style="color:#A36EA3; font-weight:bold;">J'inscris ici mon texte défilant (en mauve et en gras) grâce à la balise <marquee/>...</span></marquee>

J'inscris ici mon texte défilant (en mauve et en gras) grâce à la balise <marquee/>...


Oh... Et beaucoup d'entre vous veulent que le texte ne défile plus au passage de la souris... C'est notamment très pratique quand on fait défiler des images à la place du texte... Et bien c'est tout simple !

<marquee><span onmouseover="this.stop();" onmouseout="this.start();">J'inscris ici mon texte défilant (qui s'arrête au passage de la souris) grâce à la balise <marquee/>...</span></marquee>

J'inscris ici mon texte défilant (qui s'arrête au passage de la souris) grâce à la balise <marquee/>...

Publié dans Aides diverses

Pour être informé des derniers articles, inscrivez vous :

Commenter cet article

Ghislaine 08/12/2013 20:52


Geniale ton explication et c'est vachement sympa de ta part MERCI♥

DORA Séla 14/01/2013 10:23


Bonjour


J'ai essayé avec le blog d'aide de faire défiler le texte d'une page mais cela ne marche pas?


Je vais dans le code html de la page j'ajoute


  DOR 
 
  lasuite du texte


et en fin





CEla ne donne rien du tout ?


merci de m'aider


pour la page http://dorasela.over-blog.net/pages/CV_DORA_Sela-8466922.html

Tatihou 09/12/2011 09:16


merci de ces précisions, je n'arrivais plus à mettre une phrase défilante, et encore moin sur mon blog également canalblog. 

cody 10/11/2011 23:40



Bonjour


Comment retarder le départ d'un texte défilant?


Cordialement


JCM



Cindy 26/11/2010 20:23



JE COMPREND MAIS RIEN ! SA NE MARCHE PAAS ! ;)