suchen

Heim >Web-Frontend >js-Tutorial >JS implementiert Code für Spezialeffekte in der Statusleiste, damit Text hin und her angezeigt wird. Javascript-Kenntnisse

JS implementiert Code für Spezialeffekte in der Statusleiste, damit Text hin und her angezeigt wird. Javascript-Kenntnisse

WBOY
WBOYOriginal
2016-05-16 15:34:181310Durchsuche

Das Beispiel in diesem Artikel beschreibt die JS-Implementierung des Codes für Spezialeffekte in der Statusleiste, damit Text hin und her angezeigt wird. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Wenn Sie diesen Statusleisteneffekt ausführen, bei dem Text hin und her angezeigt wird, achten Sie bitte auf die Statusleiste in der unteren linken Ecke der Seite. Es scheint, dass der Effekt in IE8 und höheren Versionen nicht sichtbar ist. Wie wird es erreicht? Verwenden Sie hauptsächlich Funktionen zum Anzeigen von Nachrichten, nehmen Sie die aktuell anzuzeigende Zeichenfolge basierend auf dem Wert von Ort, bereiten Sie das Schließen der Anzeige nach 300 Millisekunden vor und addieren Sie eins zum erforderlichen Zeichenfolgenlängenzähler, um gleichzeitig die nächste Anzeige vorzubereiten. Verwenden Sie Funktionen zum Ausblenden der Nachricht. Nehmen Sie eine Zeichenfolge einer bestimmten Länge auf der rechten Seite der Nachricht und legen Sie die Verzögerung für das Ausblenden des nächsten Zeichens fest.

Der Screenshot des Laufeffekts sieht wie folgt aus:

Die Online-Demo-Adresse lautet wie folgt:

http://demo.jb51.net/js/2015/js-status-bar-scroll-show-codes/

Der spezifische Code lautet wie folgt: 

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var Message=" 欢迎光临脚本之家，请多多提出你的建议!!! "; //这里可自定义显示内容
var place=1;
function scrollIn() { //这个函数用来显示消息
window.status=Message.substring(0, place); //根据place的值取当前需显示的字符串
if (place >= Message.length) { //如果全部信息已经显示完毕
place=1; //则将place重置
window.setTimeout("scrollOut()",300); //准备在300毫秒后收起显示
} else { //否则(信息还没有显示完)
place++; //将需取的字符串长度计数器加一
window.setTimeout("scrollIn()",50); //准备下一次显示
  } 
}
function scrollOut() { //这个函数用来消隐消息
window.status=Message.substring(place, Message.length); //取Message右边的一定长度的字符串
if (place >= Message.length) { //如果已经无字符可取(信息已经完全消隐)
place=1; //则初始化place
window.setTimeout("scrollIn()", 100); //设定下一次操作是显示信息
} else { //否则(信息还没有消隐完毕)
place++; //计数器加一
window.setTimeout("scrollOut()", 50); //设定消隐下一个字符的延时
  }
}
// End -->
</SCRIPT>
<title>来回出现文字的状态栏特效</title>
</head>
<body onLoad="scrollIn()">
<b>请注意页面左下角的状态栏</b>
</body>

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der JavaScript-Programmierung befassen.

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
Vorheriger Artikel：jquery implementiert den Smooth-Scroll-Effektcode der Webseite_jqueryNächster Artikel：jquery implementiert den Smooth-Scroll-Effektcode der Webseite_jquery

In Verbindung stehende Artikel

Mehr sehen