Texte défilant - Avec des images
On peut également faire défiler des images accompagnant un texte, à l'intérieur d'une boîte latérale.
|
Il faut ici utiliser la balise marquee auquelle il sera nécessaire d'indiquer la direction de défilement du texte ici up |
Dans une boîte libre, on peut dans un premier temps faire comme si te texte était fixe, on insère ensuite les images aux endroits souhaités.
En pratique :
Dans l'éditeur, entrer le texte, le mettre en forme et placer les images. | Les différents éléments prennent naturellement leur place dans la boîte libre en fonction de la mise en page réalisée dans celui-ci. |
Reste maintenant à insérer le code qui permet de faire défiler l'ensemble dans cette boîte libre.
1° cas :
Défilement continu.
Code à placer dans le code source AVANT L'ENSEMBLE réalisé précédemment
CODE |
<marquee direction="up"
|
Le sens de défilement se fera de bas en haut, les dimensions de la zone de défilement sont données par la hauteur "height" (ici 180px) et le "taux" d'occupation fix" à 90% de la boîte latérale suivant sa largeur.
Code à placer APRES L'ENSEMBLE réaliser précédemment.
CODE |
</marquee>
|
2° cas :
Défilement avec des arrêts lors que la souris est sur le boîte.
Code à placer dans la code source AVANT L'ENSEMBLE réaliser dans l'éditeur de la boîte libre.
CODE |
<marquee onmouseover="this.stop()"
|
Code à placer APRES CE MEME ENSEMBLE.
CODE |
</marquee>
|
Exemple :
La totalité du code que l'on peut voir dans la source peut sembler un peu long, à titre d'exemple voici la totalité de ce qui apparaît dans la code source pour obtenir le défilement du texte et des images présentés en haut de cette fenêtre avec l'option qui permet d'avoir l'arrêt du défilement au passage de la souris.
CODE | ||
|