Eine einfache Möglichkeit, mit dem HTML-Tag „Marquee“ einen Scroll-Effekt zu erzielen (unbedingt lesen)

Eine einfache Möglichkeit, mit dem HTML-Tag „Marquee“ einen Scroll-Effekt zu erzielen (unbedingt lesen)

Der automatische Bildlaufeffekt der Seite kann durch JavaScript erzielt werden, aber heute habe ich zufällig ein HTML-Tag entdeckt – <marquee></marquee>, mit dem verschiedene Bildlaufeffekte ohne JS-Steuerung erzielt werden können.

Mit dem Laufschrift-Tag können nicht nur Texte, sondern auch Bilder, Tabellen usw. verschoben werden.

Syntax: <marquee>...</marquee>; Beschreibung: Fügen Sie den Inhalt hinzu, der zwischen den Tags gescrollt werden soll.

Wichtige Eigenschaften:

1. Scrollrichtung (einschließlich 4 Werte: nach oben, unten, links und rechts)

Syntax: <marquee direction="scroll direction">...</marquee>

2. Scrollverhalten (Scrollen: in einer Schleife scrollen, der Standardeffekt; Slide: einmal scrollen und dann anhalten; Alternate: abwechselnd vor und zurück scrollen)

Syntax: <marquee behavior="scroll mode">...</marquee>

3. Scrollgeschwindigkeit Scrollamount (mit der Scrollgeschwindigkeit wird die Länge der Bewegung bei jedem Scrollen in Pixeln festgelegt)

Syntax: <marquee scrollamount="5">...</marquee>

4. Scroll-Verzögerung scrolldelay (Setzen Sie das Scroll-Zeitintervall in Millisekunden)

Syntax: <marquee scrolldelay="100">...</marquee>

5. Scroll-Schleife (der Standardwert ist -1, der Scrollvorgang wird in einer Schleife fortgesetzt)

Syntax: <marquee loop="2">...</marquee>

6. Scrollbereich Breite, Höhe

7. Scrollende Hintergrundfarbe bgcolor

8. Leerzeichen hspace, vspace

Codebeispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >   
  2. < html   xmlns = "http://www.w3.org/1999/xhtml" >   
  3. <Kopf>   
  4. < Meta   http-equiv = "Inhaltstyp"   Inhalt = "Text/HTML; Zeichensatz=utf-8"   />   
  5. < Titel > Unbenanntes Dokument </ Titel >   
  6. </ Kopf >   
  7.   
  8. < Textkörper >   
  9. <div>   
  10. < Laufschrift   Richtung = "nach oben"   Verhalten = "scrollen"   Bildlaufbetrag = "1"   Scrollverzögerung = "0"   Schleife = "-1"   Breite = "1000"   Höhe = "50"   Hintergrundfarbe = "#0099FF"   hspace = "10"   vspace = "10" >   
  11. Bezieht sich auf die Ausrichtung des gesamten Auswahlrahmens; (2) Verhalten: Legen Sie die Bildlaufmethode fest: Scrollen: bedeutet, von einem Ende zum anderen zu scrollen. Es wird wiederholt, hat aber den Nachteil, dass kein nahtloser Bildlauf möglich ist. Slide: bedeutet, von einem Ende zum anderen zu scrollen, ohne es zu wiederholen...
  12. </Festzelt>   
  13. </div>   
  14. </ Körper >   
  15. </ html >   

Das Obige ist der gesamte Inhalt der einfachen Methode (unbedingt lesen) zur Verwendung des HTML-Tag-Laufbands zum Erzielen eines Bildlaufeffekts. Ich hoffe, es gefällt Ihnen ~

<<:  Eine kurze Diskussion zum Thema Ziehen und Sortieren von Elementen in Tabellen

>>:  So legen Sie Remotezugriffsberechtigungen in MySQL 8.0 fest

Artikel empfehlen

Zusammenfassung der Konstruktor- und Superwissenspunkte in React-Komponenten

1. Einige Tipps zu mit class in react deklarierte...

So installieren und konfigurieren Sie Redis in CentOS7

Einführung Es ist nicht nötig, Redis im Detail vo...

Detaillierte Erläuterung der Mysql-Funktionsaufrufoptimierung

Inhaltsverzeichnis Funktionsaufrufoptimierung Fun...

So verwenden Sie die Typerweiterung ohne Typingscript

Vorwort Aufgrund der schwachen Typisierung von JS...

Vue verwendet el-table, um Spalten und Zeilen dynamisch zusammenzuführen

In diesem Artikelbeispiel wird der spezifische Co...

So verwenden Sie video.js in Vue zum Abspielen von Videos im M3U8-Format

Inhaltsverzeichnis 1. Installation 2. Einführung ...

TypeScript-Problem beim Iterieren über Objekteigenschaften

Inhaltsverzeichnis 1. Problem 2. Lösung 1. Deklar...

MySQL-Fehler 1290 (HY000) Lösung

Ich habe lange mit einem Problem gekämpft und das...