La balise marquée

La balise <marquee> permet de faire défiler un objet HTML (texte, image...). 

Le comportement et l'allure de la balise <marquee> peuvent être personnalisés grâce à ses attributs.

attribut behavior

L'attribut <behavior> agit sur le style d'animation souhaité. Il peut avoir trois valeurs différentes:

  • scroll: C'est le comportement par défaut. Il permet de faire défiler l'objet d'un coté à un autre. Quand l'objet disparaît, il réapparaît à l'endroit initial et refait le cycle.
  • slide: L'objet défile d'un coté vers l'autre, quand il atteint la position finale il s'arrête et l'animation est interrompue.
  • alternate: L'objet défile en va-et-vient entre la position 1 et la position 2.

Exemple

<marquee behavior="alternate">
   Texte défilant en va-et-vient
</marquee>

Texte défilant en va-et-vient

Les attributs width et height

  • Désignent respectivement la largeur et la hauteur de la zone de défilement. Ils sont exprimés en pixel (px) qui est implicite (la valeur est déclarée sans l'unité).

L'attribut bgcolor

  •  l'attribut bgcolor spécifie la couleur d'arrière plan de la zone de défilement. Elle est exprimée en nom anglais de la couleur ou code de celle ci.

L'attribut direction

  • L'attribut direction spécifie la direction du défilement. Elle peut avoir 4 valeurs:
  1. left: Signifie vers la gauche. L'objet défile de droite à gauche.
  2. right: L'objet défile de gauche à droite.
  3. up: L'objet défile du bas vers le haut
  4. down: L'objet défile du haut vers le bas

<marquee behavior="scroll" direction="left" width="100%" bgcolor="#EEEEEE">
   <h2>Texte défilant horizontalement</h2>
</marquee><br>
<marquee behavior="scroll" direction="down" width="100%" height="200" bgcolor="#EEEEEE">
   <h2>Texte défilant verticalement</h2>
</marquee>

Texte défilant horizontalement


Texte défilant verticalement

Source

Ceci est un essai de texte défilant utilisant la balise '< marquee >'. Au survol, le texte stoppe. Au clic, il disparait.

<div id="deroule" style="width:100%;">

    <marquee scrolldelay="900" truespeed="" scrollamount="80" bgcolor="#9B0000" width="" height="" onmouseover="this.setAttribute('scrollamount', 0, 0)" onmouseout=

    "this.setAttribute('scrollamount', 80, 0);" onclick="this.setAttribute('LOOP', 1);this.setAttribute('SCROLLDELAY', 1);this.setAttribute('BGCOLOR', '');"><span style=

    "font-size: 20px;"><em><strong><span style="color: #ffffff;">Ceci est un essai de texte défilant utilisant la balise '&lt; marquee &gt;'. Au survol, le texte stoppe. Au clic, il

    disparait.</span></strong></em></span></marquee>

</div>

Retour à la page précédente