Rumah > hujung hadapan web > tutorial js > Contoh lengkap pelaksanaan JS untuk memaparkan kesan menaip dalam kemahiran status bar_javascript

Contoh lengkap pelaksanaan JS untuk memaparkan kesan menaip dalam kemahiran status bar_javascript

WBOY
Lepaskan: 2016-05-16 15:34:21
asal
1386 orang telah melayarinya

Contoh dalam artikel ini menerangkan pelaksanaan JS untuk memaparkan kesan menaip dalam bar status. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Berikut ialah demonstrasi JS melaksanakan bar status dengan kesan menaip dan memaparkan teks dengan kesan menaip dalam bar status Harap maklum bahawa kesan ini mempunyai isu keserasian penyemak imbas dan kesannya nampaknya tidak dipaparkan dalam IE7 atau lebih tinggi pelayar.

Tangkapan skrin kesan berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

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

Kod khusus adalah seperti berikut:

<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>
Salin selepas log masuk

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan JavaScript.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan