So erzielen Sie den Effekt des Scrollens von Schriftarten und Bildern mithilfe von Laufschriftelementen

Dieses Mal zeige ich Ihnen, wie das Laufschriftelement den Effekt des Scrollens von Schriftarten und Bildern erzielen kann. Was sind die Vorsichtsmaßnahmen für das Laufschriftelement, um den Effekt des Scrollens von Schriftarten und Bildern zu erzielen? Ein praktischer Fall.

Marquee-Elemente können einfache Gleiteffekte für Schriftarten (Bilder usw.) erzielen:

<style type="text/css"> 
#div01{ 
width: 500px; 
} 
</style> 
<script type="text/javascript"> 
</script> 
<marquee behavior="alertnate"><font size=30 color=&#39;red&#39;>www.baidu.com111</font></marquee> 
<marquee direction=right bgcolor=&#39;#ff2233&#39; behavior="alertnate"><font size=30 color=&#39;blue&#39;>www.baidu.com222</font></marquee> 
<marquee id="m3" direction=down bgcolor=&#39;#dbdbdb&#39; height=50px hspace=20px vspace=20px behavior="alertnate" scrollLeft=left onmouseover="this.stop()" onmouseout="this.start()"><font size=30 color=&#39;blue&#39;>www.baidu333.com</font></marquee> 
<marquee id="m4" direction=up bgcolor=&#39;#00dbdb&#39; behavior="alertnate"><font size=30 color=&#39;blue&#39;>www.baidu444.com</font></marquee>

<div id="div01"><marquee direction=right bgcolor=&#39;#ff2233&#39; behavior="alertnate" scrolldelay=100><font size=30 color=&#39;blue&#39;>www.baidu.com555</font></marquee></div> 
<input type="button" onclick="m3.stop();" value="m3.stop"></input> 
<input type="button" onclick="m3.start();" value="m3.start"></input> 
<button onclick="m4.stop();">m4.stop</button> 
<button onclick="m4.start();">m4.start</button>

Richtung stellt die Scrollrichtung dar, und der Wert kann belassen werden. rechts, oben, unten, Standard ist links
Verhalten stellt die Art des Scrollens dar, der Wert kann scrollen (kontinuierliches Scrollen) slide (einmal gleiten) alternate (vor und zurück scrollen)
loop stellt die Anzahl der Schleifen dar, Der Wert ist eine positive Ganzzahl, der Standardwert ist Endlosschleife
scrollamount stellt die Bewegungsgeschwindigkeit dar, der Wert ist eine positive Ganzzahl, der Standardwert ist 6
scrolldelay stellt die Pausenzeit dar, der Wert ist eine positive Ganzzahl, der Standardwert ist 0, die Einheit scheint Millisekunden zu sein
align stellt die vertikale Ausrichtung des Elements dar, der Wert kann oben, in der Mitte, unten sein, der Standardwert ist Mitte
bgcolor stellt die Hintergrundfarbe des Bewegungsbereichs dar, der Wert ist eine hexadezimale RGB-Farbe, der Standardwert ist Weiß
Höhe, Breite stellt die Höhe und Breite des Bewegungsbereichs dar, der Wert ist eine positive Ganzzahl (Die Einheit ist Pixel) oder ein Prozentsatz, die Standardbreite = 100 % ist die Höhe Höhe des Elements innerhalb des Tags
hspace, vspace stellen die horizontalen und vertikalen Abstände vom Element zur Bereichsgrenze dar, der Wert ist eine positive Ganzzahl, die Einheit ist Pixel.
onmouseover=this.stop() onmouseout=this.start() bedeutet, dass das Scrollen stoppt, wenn sich die Maus über dem Bereich befindet, und das Scrollen fortsetzt, wenn sich die Maus wegbewegt.
Im Folgenden wird das Scrollen oder Stoppen von m3 und m4 eingestellt, wenn auf die Schaltfläche geklickt wird:

<input type="button" onclick="m3.stop();" value="m3.stop"></input> 
<input type="button" onclick="m3.start();" value="m3.start"></input> 
<button onclick="m4.stop();">m4.stop</button> 
<button onclick="m4.start();">m4.start</button>

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie diese Fälle gelesen haben. Weitere spannende Informationen Bitte achten Sie auf andere verwandte Themen im Artikel über die chinesische PHP-Website!

Verwandte Lektüre:

So legen Sie den Rahmen- und Transparenzstil von Div fest

So verwenden Sie das Meta-Ansichtsfensterattribut von HTML

So bedienen Sie den Standardstil eines Tags

So rufen Sie die Suchmaschine auf der Seite auf

So ändern Sie die Standardübermittlungsmethode des Formulars

Das obige ist der detaillierte Inhalt vonSo erzielen Sie den Effekt des Scrollens von Schriftarten und Bildern mithilfe von Laufschriftelementen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!