HTML verwendet Laufschrift, um Text nach links und rechts scrollen zu lassen

HTML verwendet Laufschrift, um Text nach links und rechts scrollen zu lassen

Code kopieren
Der Code lautet wie folgt:

<KÖRPER>
//Mit Hilfe von Marquee
<MARQUEE behavior="scrollen" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="3" width="100">
<SPAN unselectable="on">Hier ist der Inhalt zum Scrollen</SPAN>
</MARQUEE>

//Gewöhnliche Implementierungsmethode
<DIV id="scrollobj" style="white-space:nowrap;overflow:hidden;width:500px;">
<span>Hier ist der Inhalt zum Scrollen</span>
</DIV>
<script language="javascript" type="text/javascript">
Funktion scrollen(Objekt) {
var tmp = (obj.scrollLeft)++;
//Wenn die Bildlaufleiste oben rechts ankommt
wenn (obj.scrollLeft==tmp) obj.innerHTML += obj.innerHTML;
//Wenn die Bildlaufleiste die Breite des ursprünglichen Inhalts durchläuft, kehrt die Bildlaufleiste zum äußersten linken Ende zurück
wenn (obj.scrollLeft>=obj.firstChild.offsetWidth) obj.scrollLeft=0;
}
setInterval("scroll(document.getElementById('scrollobj'))",20);
</Skript>
</BODY>

<<:  Ein praktischer Bericht über einen durch den MySQL-Start verursachten Unfall

>>:  Verwendung der VUE-Renderfunktion und ausführliche Erklärung

Artikel empfehlen

Bringen Sie Ihnen bei, wie Sie den Beobachtermodus in Javascript implementieren

Inhaltsverzeichnis Was ist das Beobachtermuster? ...

Was Sie beim Schreiben selbstschließender XHTML-Tags beachten sollten

Das img-Tag in XHTML sollte wie folgt geschrieben...

Implementierungs- und Nutzungsszenarien der JS-Anti-Shake-Drosselungsfunktion

Inhaltsverzeichnis 1. Was ist die Anti-Shake-Funk...

Erklärung zur Änderung des npm Taobao-Spiegels

1. Nutzung auf höchster Ebene 1. Installieren Sie...

Lösung für die falsche Ausrichtung des Eingabecursors in Chrome, Firefox und IE

Detaillierte Erklärung zur Fehlplatzierung des Ein...

Implementierung einfacher Tabs mit js

Tab-Auswahlkarten werden auf echten Webseiten seh...

Beispielcode zur Implementierung einer Pivot-Tabelle in MySQL/MariaDB

Im vorherigen Artikel wurden mehrere Methoden zur...

So verpacken Sie das Uniapp-Projekt als Desktop-Anwendung

Electron installieren cnpm installiere Electron -...

Mehrere Methoden zur Implementierung von Karussellbildern in JS

Karussell Die Grundidee ist: Im großen Container ...