用四个符号(-、、|、/) 来模拟不断旋转

一个简单的loading效果，用四个符号(-、、|、/) 来模拟一个不断旋转的小东东，以提示用户当前正在载入中，ArcLive 上为玩家建立连线时便是这样显示的，呵呵。效果如下：

载入中...

JavaScript Code：

view source

 

print?

01	<script type="text/javascript">

02	// <![CDATA[

03	function easy_loading(id)

04

{

05	var symbol = ['-', '\', '|', '/'],

06	elem = document.getElementById(id),

07

i = 0;

08	(function __func() {

09	elem.innerHTML = symbol[i++ % 4];

10	setTimeout(__func, 200);

11

})();

12

}

13	easy_loading('loadin');

14

// ]]>

15

</script>

为了避免可能出现的阻塞浏览器线程的情况，这里用setTimeout 代替了setInterval。

让人想起了DOS下QBasic和FoxBase那种远去的亲切吧 :)setTimeout()的使用方法

setTimeout (表达式，延时时间)、setTimeout(表达式，交互时间)，延时时间/交互时间是以豪秒为单位的(1000ms=1s)。

setTimeout  在执行时，是在载入后延迟指定时间后，去执行一次表达式，仅执行一次。setTimeout 在执行时，它从载入后，每隔指定的时间就执行一次表达式。

下面是基本用法。

执行一段代码：

view source

 

print?

1

var i=0;

2	setTimeout("i+=1;alert(i)",1000);

执行一个函数：

view source

 

print?

1

var i=0;

2	setTimeout(function(){i+=1;alert(i);},1000);

下面再来一个执行函数的：

view source

 

print?

1

var i=0;

2	function test(){

3

i+=1;

4

alert(i);

5

}

6	setTimeout("test()",1000);

setTimeout的原型是这样的：iTimerID = window.setTimeout(vCode, iMilliSeconds [, sLanguage])

用setTimeout实现setInterval的功能

思路很简单，就是在一个函数中调用不停执行自己，有点像递归。

view source

 

print?

1

var i=0;

2	function xilou(){

3

i+=1;

4	if(i>10){alert(i);return;}

5	setTimeout("xilou()",1000);

6

//用这个也可以

7	//setTimeout(xilou,1000);

8

}