Heim  >  Artikel  >  Web-Frontend  >  So erzielen Sie einen Text-Scroll-Effekt in HTML5

So erzielen Sie einen Text-Scroll-Effekt in HTML5

PHPz
PHPznach vorne
2016-05-16 15:49:418227Durchsuche

In diesem Artikel erfahren Sie, wie Sie in HTML5 einen Text-Scroll-Effekt erzielen. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

So erzielen Sie einen Text-Scroll-Effekt in HTML5

HTML5 implementiert Text-Scroll-Effekt

<div class="custom-notice">
   <i class="icon-notice"></i>
   <marquee class="noticeText ng-binding" direction="left" behavior="alternate" scrollamount="100" scrolldelay="1000" loop="5" width="100%" onmouseover="this.stop();" onmouseout="this.start();"  style="width: 100%;">充值公告:首充100送1元</marquee>
</div>

1

Die Scrollrichtung dieses Attributs kann auf vier Werte eingestellt werden: nach oben (Text nach oben), nach unten (Text nach unten), links (Text nach links), rechts (Text nach rechts).

2. Verhalten des Scrollmodus-Attributs

Der Wert dieses Attributs hat drei Werte: Scrollen (zyklisches Scrollen, Standardeffekt), Slide (nur einmal scrollen und dann anhalten). ), alternierend (abwechselnd hin und her scrollen)

3. Bildlaufgeschwindigkeitsattribut scrollamount

Dieses Attribut kann die Geschwindigkeit des Bildlaufs von Text anpassen tatsächlich festgelegt durch Die Länge jeder Bewegung des Lauftexts in Pixeln. Der Wert enthält nur Zahlen ohne die Einheit px. Wenn die Einheit enthalten ist, ist die Einstellung ungültig.

4. Scrollverzögerungsattribut scrolldelay

Dieses Attribut wird verwendet, um das Zeitintervall für das Scrollen von Text festzulegen (das Zeitintervall zwischen zwei Scrollschritten).

Die Zeitintervalleinheit der Bildlaufverzögerung ist Millisekunden und der Wert schreibt nur Zahlen

5. Die Bildlaufschleifenattributschleife

Nach dem Festlegen des Bildlaufs Der Standardwert lautet: Die Schleife wird auf unbestimmte Zeit fortgesetzt. Wenn Sie die Anzahl der Schleifen steuern möchten, können Sie diese Eigenschaft festlegen.

6. Scrollbereichsattribute Breite und Höhe

Wenn Sie den Scrollbereich von Text steuern möchten, können Sie diese beiden Attribute in Pixeln verwenden und keine px-Einheiten schreiben. Standardmäßig entspricht die Breite beim Scrollen nach links und rechts der Breite des Browserfensters und die Höhe entspricht der Höhe des Texts. Beim Hoch- und Runterfahren beträgt die Höhe ein Drittel der Browserfensterhöhe.

7. Scroll-Hintergrundfarbenattribut bgcolor

Dieses Attribut legt die Hintergrundfarbe für den Scrollbereich fest (der Wert ist ein hexadezimaler Farbcode und Englisch).

8. Scroll-Space-Attribut hspace&vspace

hsapce-Attribut kann die horizontale Position des Scrollbereichs festlegen, und vspace wird verwendet, um die vertikale Position des Scrollbereichs festzulegen. Die Einheiten sind alle Pixel, und die Einheit px wird beim Schreiben des Werts nicht geschrieben.

Weitere Kenntnisse zum Thema Programmierung finden Sie unter: Einführung in die Programmierung! !

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen