Newsticker - Laufschrift mit Marquee

Mit dem Html-Tag "Marquee" kann im Nu ein Newsticker bzw. eine Laufschrift für Ihre Homepage erzeugt werden. Durch bestimmte Attribute lässt sich die Laufrichtung, Geschwindigkeit, Verhaltensweise etc. regeln! Ggf. können Sie den Newsticker auch zusätzlich noch mit etwas CSS entsprechend stylen. Nachfolgend finden Sie dazu einige Beispiele:

Die Attribute von Marquee:

<marquee direction="right">Newsticker nach rechts</marquee>

<marquee direction="left">Newsticker nach links</marquee>

<marquee behavior="alternate">oszillierende Laufschrift</marquee>

<marquee behavior="slide">Laufschrift wird bis zum
Ende der Zeile eingeschoben</marquee>

<marquee behavior="alternate" loop="6">Laufschrift
oszilliert 5x und stoppt am Ende</marquee>

<marquee loop="5">Nach 5x Umlaufen verschwindet die Laufschrift</marquee>

<marquee scrollamount="8">schneller Newsticker</marquee>

<marquee scrollamount="2">langsamer Newsticker</marquee>

<marquee hspace="150">Newsticker mit Abstand (nur IE + FF)</marquee>

Newsticker mit Grafik

<marquee scrollamount="3"><img src="images/grafik.gif"> Newsticker
mit Grafik <img src="images/grafik.gif"></marquee>

<marquee>Newsticker mit <a href="#">Link</a></marquee>

CSS-formatierter Newsticker:

<marquee class="marquee" behavior="alternate">bunter Newsticker</marquee>

Anweisungen in der CSS-Datei für bunten Newsticker:

.marquee
{
color: #fff;
border: 3px double #E10024;
background-image: url('images/bg.gif');
background-repeat: repeat-x;
line-height: 26px
}

Up- and Down-Textscroller:

<marquee direction="up" height="100" scrollamount="2">
Textscroller nach oben</marquee>

<marquee direction="down" height="100" scrollamount="2">
Textscroller nach unten</marquee>

Marquee mit Javascript:

<marquee onmouseover="this.scrollAmount=1" onmouseout="this.scrollAmount=5">
Newsticker mit Link, der beim Hovern langsamer wird! <a target="_blank"
href="#">Hyperlink</a></marquee>

<marquee onmouseover="this.scrollAmount=0" onmouseout="this.scrollAmount=5">
Newsticker mit Link, der beim Hovern stoppt! <a target="_blank"
href="#">Hyperlink</a></marquee>

Blinkender Text mit "blink":

Hinweis: Lediglich im IE funktioniert "blink" nicht!

blinkender Text

<p><blink>blinkender Text</blink></p>

<marquee><blink>blinkender Newsticker</blink></marquee>

[ veröffentlicht am 15.02.2009 ] __________________________

  zurück | weiter