Das HTML Attribut <marquee> - Laufschrift in NOF einbauen
Zieht Euch ein Texfeld auf, schreibt Euren Text und tragt das Attribut mit Euren Parametern einfach in den Objekt-Editor vom Textfeld ein.
Vor dem Tag:
<marquee>
nach dem Tag (schließen):
</marquee>
Hier noch einige Parameter zu Marquee:
<marquee direction="left"> Marquee von rechts nach links </marquee>
<marquee direction="right"> Marquee von links nach rechts </marquee>
<marquee behavior="alternate"> Marquee wechselnd </marquee>
<marquee scrollamount="10" scrolldelay="10"> Marquee Geschwindigkeit 1 sehr langsam 10 sehr schnell </marquee>
<marquee> Marquee mit Bild <img src="bild.jpg"> </marquee>
<marquee> Marquee mit <a href="http://www.example.com"> Hyperlink </a> </marquee>
<marquee style="background: red; color: yellow" behavior="alternate"> Marquee mit Farbe </marquee>
<marquee loop="5"> Marquee wird nur 5 mal durchlaufen! </marquee>
<marquee direction="up" scrollamount="2" style="height: 80px;"> Marquee von unten nach oben </marquee>
<marquee direction="down" scrollamount="3" style="height: 80px;"> Marquee von oben nach unten </marquee>
Marquee mit CSS3 Animation:
Unten mit einer CSS3 Animation von Webbausteine.de, die Laufschrift stoppt bei Mausüber, hier mit einer Breite von 700px.
Viel Spaß - nur für moderne Browser - nicht IE8 - hier stoppt die Laufschrift bei Mausüber - nach oben
Beispiel meiner Style-Anweisung in der HTML vom Layout “Zwischen Head Tags”:
<style>
@keyframes marquee {
0% { text-indent: 700px }
100% { text-indent: -700px }
}
.marquee {
width: 700px;
margin: auto;
padding: 2px;
overflow: hidden;
white-space: nowrap;
border: solid 1px #CCCCCC;
border-radius: 5px;
box-shadow: 2px 2px 3px #999999;
animation: marquee 20s linear infinite;
}
.marquee:hover {
animation-play-state: paused;
}
</style>
Class dem <p> oder <div> Tag mit dem Inhalt geben:
<p class="marquee"> Marquee mit CSS3 </p>
