JavaScript实例教程(十五)状态栏文字拉长的效果

觉罗启兴

觉罗启兴

2016-02-19 14:41

只要你有一台电脑或者手机,都能关注图老师为大家精心推荐的JavaScript实例教程(十五)状态栏文字拉长的效果,手机电脑控们准备好了吗?一起看过来吧!

本例实现的效果是状态栏的文字由右向左,风一样的飘过来,当都飘到右边的时候,不停的循环前一次的效果,给人耳目一新的感觉呢。

下面是源代码:

SCRIPT LANGUAGE="JavaScript"

timeID = 5;
stcnt = 11;
msg = "欢迎光临5D多媒体";
//你希望状态栏出现的文字,可以自由改动哟!
wmsg = new Array(33);
wmsg[0] = msg;
blnk = " ";
for (i = 1; i 32; i++) {
b = blnk.substring(0, i);
wmsg[i] = "";
for (j = 0; j msg.length; j++) wmsg[i] = wmsg[i] + msg.charAt(j) + b;
}
//以上的循环语句的作用是定义一个由空格组成的变量blnk,分别赋予wmsg[1]到wmsg[31]不同间隔的空格与字符的组合
function wiper() {
if (stcnt -1) str = wmsg[stcnt];
else str = wmsg[0];
if (stcnt-- -40) stcnt = 31;
status = str;
clearTimeout(timeID);
timeID = setTimeout("wiper()", 150);
}
//以上的函数的作用是写出文字,并间隔150mm变换一次字间句距,然后等待后重新写。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

/script

在head和/head标签之间输入以上代码

把body改为BODY OnLoad="wiper()"

就是载入函数wiper()

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

以下是上述代码的运行结果:

JavaScript实例教程(十五)状态栏文字拉长的效果

JavaScript实例教程(十五)状态栏文字拉长的效果

例中的关键部分还是在于wiper()这个函数,希望大家对于这段函数代码多多揣摩研究,一定会有不小的收获的,如果不太清楚函数的用法,请参考以前所讲的和相关资料。

展开更多 50%)
分享

猜你喜欢

JavaScript实例教程(十五)状态栏文字拉长的效果

Web开发
JavaScript实例教程(十五)状态栏文字拉长的效果

JavaScript实例教程(九)活动文字的状态栏

Web开发
JavaScript实例教程(九)活动文字的状态栏

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

FireFox 如何用Javascript 修改状态栏

Web开发
FireFox 如何用Javascript 修改状态栏

CAD状态栏对象捕捉使用实例

cad教程 autocad教程 CAD
CAD状态栏对象捕捉使用实例

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

adobe dreamweaver教程状态栏

Dreamweaver 电脑应用
adobe dreamweaver教程状态栏

Access 2007 状态栏

编程语言 网络编程
Access 2007 状态栏

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Delphi 2007体验!

Delphi 2007体验!

jquery.ui.draggable中文文档

jquery.ui.draggable中文文档
下拉加载更多内容 ↓