이 기사의 예에서는 상태 표시줄에 입력 효과를 표시하는 JS 구현을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.
다음은 JS에서 입력 효과를 구현하고 상태 표시줄에 입력 효과가 있는 텍스트를 표시하는 데모입니다. 이 효과는 브라우저 호환성 문제가 있으며 IE7 이상에서는 효과가 표시되지 않는 것 같습니다. 브라우저.
런닝 효과 스크린샷은 다음과 같습니다.
온라인 데모 주소는 다음과 같습니다.
http://demo.jb51.net/js/2015/js-status-bar-show-txt-print-demo/
구체적인 코드는 다음과 같습니다.
<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>
이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.