Maison > interface Web > js tutoriel > Exemple complet d'implémentation JS de l'affichage de l'effet de frappe dans les compétences barre d'état_javascript

Exemple complet d'implémentation JS de l'affichage de l'effet de frappe dans les compétences barre d'état_javascript

WBOY
Libérer: 2016-05-16 15:34:21
original
1374 Les gens l'ont consulté

L'exemple de cet article décrit l'implémentation JS de l'affichage de l'effet de frappe dans la barre d'état. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Voici une démonstration de JS implémentant une barre d'état avec des effets de saisie et affichant du texte avec des effets de saisie dans la barre d'état. Notez que cet effet présente des problèmes de compatibilité avec le navigateur et qu'il ne semble pas être affiché dans IE7 ou version ultérieure. navigateurs.

La capture d'écran de l'effet en cours d'exécution est la suivante :

L'adresse de la démo en ligne est la suivante :

http://demo.jb51.net/js/2015/js-status-bar-show-txt-print-demo/

Le code spécifique est le suivant :

<html>
<head>
<script language="JavaScript">
//以下几条可以根据需要改变
var msg = "欢迎光临,请多多提出你的建议!!!  " ;//需要显示的内容
var interval = 120 //显示每个字的时间间隔(毫秒)
//以下内容不需更改
var seq=0;
function typetext() {
len = msg.length;//取得信息的总长度
window.status = msg.substring(0, seq+1);//取得需显示的部分
seq++; //将长度加一(为下一次显示做准备)
if ( seq >= len ) { //如果已经内容全部显示出来
seq = 0; //则恢复初始状态,准备再次显示
window.status = '';
window.setTimeout("typetext();", interval );//设定下一次显示的间隔
}
else //如果信息还没有显示完整
window.setTimeout("typetext();", interval ); //则设定下一次显示的时间间隔
} 
typetext(); //当页面装入的时候开始第一次显示
</script>
<title>在状态栏显示打字效果</title>
</head>
<body>
<b>请注意页面左下角的状态栏</b>
</body>
</html>
Copier après la connexion

J'espère que cet article sera utile à tout le monde dans la programmation JavaScript.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal