SchreibMalWas

Lauftext (Ticker)

"Eine weit im Internet verbreitete Methode, um die Aufmerksamkeit der Webseitenbesucher auf bestimmte Dinge zu lenken, ist Bewegung und Farbwechsel.
 Deswegen werden bewegliche Lauftexte (auch Ticker genannt) sehr heufig für News auf der Webseite verwendet.

Ein Lauftext lässt sich mit <marquee>text</marquee> realisieren.
Es lassen sich verschiedene Einstellungen vornehmen, standardmäßig läuft der Text in einer Dauerschleife von links nach rechts durch den Anzeigebereich.
Innerhalb des marquee-Elements lassen sich alle arten von HTML-Code (auch Bilder oder Links) einfügen.


Über das Atribut direction lässt sich die Laufrichtung ändern.

<marquee direction="left">Text</marquee>
Deffiniert einen nach links durchlaufenden Text.
Text

<marquee direction="right">Text</marquee>
Deffiniert einen nach rechts laufenden Text.
Text

<marquee direction="up" style="height:4em">Text</marquee>
Deffiniert einen nach oben laufenden Text. Damit dies besser zur Geltung kommt, wurde die Höhe auf 4 Zeilen gesetzt.
Text

<marquee direction="down" style="height:4em">Text</marquee>
Deffiniert einen nach unten laufenden Text. Damit dies besser zur Geltung kommt, wurde die Höhe auf 4 Zeilen gesetzt.
Text

Es lassen sich auch mehrere Ticker in verschiedene Richtungen verschachteln und somit schräg laufende Texte erstellen:
<marquee direction="down" style="height:4em"><marquee direction="right">Text</marquee></marquee>
Dies erzeugt einen nach unten rechts laufenden Text.
Text


Mittels behavior wird die Druchflussart bestimmt.

Standardmäßig kommt der Text von einer Seite, läuft durch das Bild und verschwindet wieder auf der anderen Seite. Dies entspricht der Einstellung:
<marquee behavior="scroll">Text</marquee>
Text

Möchte man einen Text, welcher stets hin und her wandert, so benötigt man folgende Einstellung:
<marquee behavior="alternative">Text</marquee>
Text

Es lässt sich auch ein einmaliger Lauftext erstellen, welcher nach dem ersten Druchlauf stehen bleibt:
<marquee behavior="slide">Text</marquee>
Text


Mit loop lässt sich auch die Durchlaufmenge bestimmen:

<marquee loop="3" behavior="scroll">Text</marquee>
Dieser Lauftext läuft 3x durch das Bild und verschwindet dann
Text

<marquee loop="6" behavior="alternative">Text</marquee>
Dieser Lauftext läuft 6x hin und her
Text

<marquee loop="8" behavior="slide">Text</marquee>
Dieser Lauftext bleibt nach dem achten Duchlauf stehen
Text


Möchte man Pausen zwischen mehreren Durchläufen, so lassen sich diese mittels scrolldelay bewerkstelligen.
Beispiel:
<marquee scrolldelay="1">Text</marquee>
Text


Die Geschwindigkeit des Lauftextes lässt sich mit scrollamount einstellen.
Je höher der Wert ist, desto schneller ist der Ticker. Bei Geschwindigkeit 0 bleibt der Text stehen, bei negativen Werten bewegt er sich in die entgegengesetzte Richtung.

Dies ist ein langsamer Lauftext:
<marquee scrollamount="2">Text</marquee>
Text

Dies ist ein sehr schneller Lauftext:
<marquee scrollamount="15">Text</marquee>
Text

Dieser Lauftext bewegt sich nicht:
<marquee scrollamount="0">Text</marquee>
Text


Tipp:
Mittels Javascript können Eigenschaften eines Lauftextes verändert werden, so kann man ihn z. B. langsamer werden lassen oder anhalten, sobald man mit der Maus über ihn fährt.

<marquee scrollamount="5" onmouseover="this.ScrollAmount=1" onmouseout="this.ScrollAmount=5">Text</marquee>
Dieser Lauftext wird langsamer, sobald man mit der Maus auf ihn zeigt, verlässt man ihn, so wird er wieder schneller
Text






Kommentare zu dieser Seite:
Kommentar von:28.09.2016 um 17:36 (UTC)
andre-redeker
andre-redeker
Offline

Hi, kann man den "text" auch von rechts nach links und am bildrand wieder nach rechts laufen lassen?
Coole Seite

Kommentar von:24.07.2015 um 05:07 (UTC)
killerpot2342
killerpot2342
Offline

<Marquee>text</Marquee>



Kommentar zu dieser Seite hinzufügen:
Ihr Name:
Ihre Homepage:
Ihre Nachricht:

Sie sind der 28687 Besucher auf Schreibmalwas-homepagetools Statistiken
=> Willst du auch eine kostenlose Homepage? Dann klicke hier! <=
"