Heim  >  Artikel  >  Web-Frontend  >  So implementieren Sie das Scrollen von Text mit Javascript

So implementieren Sie das Scrollen von Text mit Javascript

藏色散人
藏色散人Original
2021-09-14 11:24:557163Durchsuche

So implementieren Sie Text-Scrolling mit JavaScript: 1. Erstellen Sie eine HTML-Beispieldatei. 2. Fügen Sie Skript-Tags hinzu. 3. Verwenden Sie „$(“.txtBox“).addClass(“txtBox_4“);“ Einstellung Der Text kann horizontal angeordnet und gescrollt werden.

So implementieren Sie das Scrollen von Text mit Javascript

Die Betriebsumgebung dieses Artikels: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Wie implementiert man das Scrollen von Text mit Javascript?

js, um einen Text-Scroll-Effekt zu erzielen

Zuvor hat Ihnen der Editor einige häufig verwendete js-Animationseffekte vorgestellt. Hier stelle ich Ihnen einen Animationseffekt vor, der möglicherweise nicht häufig vorkommt gebraucht. . Dieser Animationseffekt bezieht sich auf Text, und obwohl er nicht häufig verwendet wird, hat ihn fast jeder gesehen.

Ich glaube, dass jeder Kugou Music oder NetEase Cloud Music zum Suchen und Anhören von Musik verwendet. Nach langer Zeit werden Sie auf jeden Fall den Text-Scroll-Effekt auf der Liedtextseite sehen. Dieser Animationseffekt ist derselbe, unterscheidet sich jedoch etwas von diesen Musiktexteffekten und fügt den Effekt der vertikalen Textanordnung und des Scrollens hinzu.

Vor der Einführung lernen wir einige Möglichkeiten der vertikalen Textanordnung kennen:

Writing-Mode-Attribut

1. Wert:
(1) Vertical-Rl |. tb |. tb-rl
(2) Kompatibler Schreibmodus: horizontal-tb | Vertical-rl | nicht kompatibel im IE)
Standardwert: normal
Anwendbar auf: alle Elemente außer Tabellenzeilengruppe, Tabellenspaltengruppe, Tabellenzeile, Tabellenspalte
Vererbung: Ja
Animationseigenschaft: Nein
Berechneter Wert: Spezifisch Wert

2. Einführung in den Wert des Schreibmodus

(1) horizontal-tb: horizontale Schreibmethode von oben nach unten. Das heißt, links-rechts-oben-unten (ähnlich dem privaten IE-Wert lr-tb)
(2) Vertical-rl: vertikal von rechts nach links geschrieben. Das heißt, oben-unten-rechts-links (ähnlich dem privaten IE-Wert tb-rl)
(3) Vertical-Lr: Vertikales Schreiben von links nach rechts. Das heißt, oben-unten-links-rechts
(4) lr-tb: links-rechts, oben-unten. Der Inhalt des Objekts fließt horizontal von links nach rechts, wobei die nächste Zeile unter der vorherigen Zeile liegt. Alle Glyphen sind vertikal und nach oben gerichtet. Dieses Layout wird in romanischen Sprachen (IE) verwendet
(5) tb-rl: oben-unten, rechts-links. Der Inhalt eines Objekts fließt vertikal von oben nach unten und von rechts nach links. Die nächste vertikale Reihe befindet sich links von der vorherigen vertikalen Reihe. Zeichen voller Breite zeigen (6) gerade nach oben, Zeichen halber Breite wie lateinische Buchstaben oder Katakana werden um 90 Grad im Uhrzeigersinn gedreht. Dieses Layout wird häufig in ostasiatischen Sprachen (IE) verwendet

Das obige ist der detaillierte Inhalt vonSo implementieren Sie das Scrollen von Text mit Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn