Das Laufschriftelement implementiert Effekte wie scrollende Schriften und Bilder

Das Laufschriftelement implementiert Effekte wie scrollende Schriften und Bilder
Mit dem Laufschriftelement können Sie einfache Gleiteffekte für Schriftarten (Bilder usw.) und andere Effekte erzielen:

Code kopieren
Der Code lautet wie folgt:

<style type="text/css">
#div01{
Breite: 500px;
}
</Stil>
<Skripttyp="text/javascript">
</Skript>
<marquee behavior="alertnate"><font size=30 color='red'>www.baidu.com111</font></marquee>
<marquee direction=right bgcolor='#ff2233' behavior="alertnate"><font size=30 color='blue'>www.baidu.com222</font></marquee>
<marquee id="m3" Richtung=nach unten bgcolor='#dbdbdb' Höhe=50px hspace=20px vspace=20px Verhalten="alertnate" Scrolllinks=links onmouseover="this.stop()" onmouseout="this.start()"><font size=30 color='blue'>www.baidu333.com</font></marquee>
<marquee id="m4" direction=up bgcolor='#00dbdb' behavior="alertnate"><font size=30 color='blue'>www.baidu444.com</font></marquee>



<div id="div01"><marquee direction=right bgcolor='#ff2233' behavior="alertnate" scrolldelay=100><font size=30 color='blue'>www.baidu.com555</font></marquee></div>
<input Typ="Schaltfläche" onclick="m3.stop();" Wert="m3.stop"></input>
<input Typ="Schaltfläche" onclick="m3.start();" Wert="m3.start"></input>
<button onclick="m4.stop();">m4.stop</button>
<button onclick="m4.start();">m4.start</button>

direction gibt die Scrollrichtung an. Die Werte können links, rechts, oben, unten sein. Der Standardwert ist links.
behavior gibt den Scrollmodus an. Der Wert kann scroll (kontinuierliches Scrollen), slide (einmal schieben) oder alternate (vor- und zurückscrollen) sein.
loop gibt die Anzahl der Schleifen an, der Wert ist eine positive Ganzzahl, der Standardwert ist eine Endlosschleife
scrollamount gibt die Bewegungsgeschwindigkeit an, der Wert ist eine positive Ganzzahl, der Standardwert ist 6
scrolldelay gibt die Pausenzeit an. Der Wert ist eine positive Ganzzahl. Der Standardwert ist 0. Die Einheit scheint Millisekunden zu sein.
align gibt die vertikale Ausrichtung des Elements an. Der Wert kann oben, mittig oder unten sein. Der Standardwert ist mittig.
bgcolor gibt die Hintergrundfarbe des Bewegungsbereichs an. Der Wert ist eine hexadezimale RGB-Farbe. Der Standardwert ist weiß.
Höhe und Breite stellen die Höhe und Breite des Bewegungsbereichs dar. Der Wert ist eine positive Ganzzahl (in Pixeln) oder ein Prozentsatz. Die Standardbreite beträgt 100 %. Höhe ist die Höhe des Elements im Tag.
hspace und vspace stellen die horizontalen und vertikalen Abstände vom Element zur Regionsgrenze dar. Die Werte sind positive Ganzzahlen in Pixeln.
onmouseover=this.stop() onmouseout=this.start() bedeutet, dass das Scrollen stoppt, wenn sich die Maus über dem Bereich befindet, und fortgesetzt wird, wenn die Maus wegbewegt wird.

Nachfolgend finden Sie die Einstellung für das Scrollen bzw. Anhalten von m3 und m4 beim Klicken auf die Schaltfläche:

Code kopieren
Der Code lautet wie folgt:

<Eingabetyp="Schaltfläche" onclick="m3.stop();" Wert="m3.stop"></Eingabe>
<input Typ="Schaltfläche" onclick="m3.start();" Wert="m3.start"></input>
<button onclick="m4.stop();">m4.stop</button>
<button onclick="m4.start();">m4.start</button>

<<:  Implementierung einer MySQL-Sicherungsstrategie (vollständige Sicherung + inkrementelle Sicherung)

>>:  25 neue nützliche Icon-Sets zum Download im Ausland

Artikel empfehlen

Hilfe zum Webdesign: Datenreferenz für Web-Schriftgrößen

<br />Der Inhalt wurde aus dem Internet repr...

React erhält den Eingabewert und übermittelt 2 Methodenbeispiele

Methode 1: Verwenden Sie das Zielereignisattribut...

Web-Theorie: Bringen Sie mich nicht zum Nachdenken über Lesehinweise

Kapitel 1 <br />Das wichtigste Prinzip, um ...

Viewport-Parameter für mobile Browser (Web-Frontend-Design)

Mobile Browser platzieren Webseiten in einem virtu...

vue+echarts realisiert den Flusseffekt der China-Karte (detaillierte Schritte)

@vue+echarts realisiert den Flusseffekt der China...

Schritte zur Erstellung einer React Fiber-Struktur

Inhaltsverzeichnis React-Fasererstellung 1. Bevor...

Detaillierte Erklärung des Prinzips und der Funktion des JavaScript-Closures

Inhaltsverzeichnis Einführung Verwendung von Vers...

Grafisches Tutorial zur Installation und Konfiguration von MySQL Server 5.7.20

Dieser Artikel zeichnet die Installations- und Ko...