该博客主要介绍了使用JavaScript实现状态栏文字特效的方法，包括文字从状态栏右边、左边冒出，以及文字在状态栏逐字放入等效果。通过定义函数和变量，利用循环和定时器实现文字的动态显示。
1 文字从状态栏右边冒出
2 文字从状态栏左边冒出
3 文字在状态栏逐字放入
1
<html>
2<head>
3 <title>文字从状态栏右边冒出</title>
4</head>
5<body>
6
7
<script language="JavaScript">
8
<!--
9
function statusMessageObject(p,d) {
10 this.msg = MESSAGE
11 this.out = " "
12 this.pos = POSITION
13 this.delay = DELAY
14 this.i = 0
15 this.reset = clearMessage
16
}
17function clearMessage() {
18 this.pos = POSITION
19}
20var POSITION = 100
21var DELAY = 4
22 var MESSAGE = "状态栏文字快速的一个一个弹出！！！ "
23var scroll = new statusMessageObject()
24function scroller() {
25 for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) {
26 scroll.out += " "
27 }
28 if (scroll.pos >= 0)
29 scroll.out += scroll.msg
30 else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length)
31 window.status = scroll.out
32 scroll.out = " "
33 scroll.pos--
34 if (scroll.pos < -(scroll.msg.length)) {
35 scroll.reset()
36 }
37 setTimeout ("scroller()",scroll.delay)
38}
39function snapIn(jumpSpaces,position) {
40 var msg = scroll.msg
41 var out = ""
42 for (var i=0; i<position; i++)
43 {out += msg.charAt(i)}
44 for (i=1;i<jumpSpaces;i++)
45 {out += " "}
46 out += msg.charAt(position)
47 window.status = out
48 if (jumpSpaces <= 1) {
49 position++
50 if (msg.charAt(position) == " ")
51 {position++ }
52 jumpSpaces = 100-position
53 } else if (jumpSpaces > 3)
54 {jumpSpaces *= .75}
55 else
56 {jumpSpaces--}
57 if (position != msg.length) {
58 var cmd = "snapIn(" + jumpSpaces + "," + position + ")";
59 scrollID = window.setTimeout(cmd,scroll.delay);
60 } else {
61 window.status=""
62 jumpSpaces=0
63 position=0
64 cmd = "snapIn(" + jumpSpaces + "," + position + ")";
65 scrollID = window.setTimeout(cmd,scroll.delay);
66 return false
67 }
68 return true
69}
70snapIn(100,0);
71
// -->
72</script>
73
74</body>
75</html>
<html>2
<head>3
<title>文字从状态栏右边冒出</title>4
</head>5
<body>6
7
<script language="JavaScript"> 8
<!-- 9
function statusMessageObject(p,d) { 10
this.msg = MESSAGE 11
this.out = " " 12
this.pos = POSITION 13
this.delay = DELAY 14
this.i = 0 15
this.reset = clearMessage 16
} 17
function clearMessage() { 18
this.pos = POSITION 19
} 20
var POSITION = 100 21
var DELAY = 4 22
var MESSAGE = "状态栏文字快速的一个一个弹出！！！ " 23
var scroll = new statusMessageObject() 24
function scroller() { 25
for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) { 26
scroll.out += " " 27
} 28
if (scroll.pos >= 0) 29
scroll.out += scroll.msg 30
else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length) 31
window.status = scroll.out 32
scroll.out = " " 33
scroll.pos-- 34
if (scroll.pos < -(scroll.msg.length)) { 35
scroll.reset() 36
} 37
setTimeout ("scroller()",scroll.delay) 38
} 39
function snapIn(jumpSpaces,position) { 40
var msg = scroll.msg 41
var out = "" 42
for (var i=0; i<position; i++) 43
{out += msg.charAt(i)} 44
for (i=1;i<jumpSpaces;i++) 45
{out += " "} 46
out += msg.charAt(position) 47
window.status = out 48
if (jumpSpaces <= 1) { 49
position++ 50
if (msg.charAt(position) == " ") 51
{position++ } 52
jumpSpaces = 100-position 53
} else if (jumpSpaces > 3) 54
{jumpSpaces *= .75} 55
else 56
{jumpSpaces--} 57
if (position != msg.length) { 58
var cmd = "snapIn(" + jumpSpaces + "," + position + ")"; 59
scrollID = window.setTimeout(cmd,scroll.delay); 60
} else { 61
window.status="" 62
jumpSpaces=0 63
position=0 64
cmd = "snapIn(" + jumpSpaces + "," + position + ")"; 65
scrollID = window.setTimeout(cmd,scroll.delay); 66
return false 67
} 68
return true 69
} 70
snapIn(100,0); 71
// --> 72
</script> 73
74
</body>75
</html> 2 文字从状态栏左边冒出
1<html>
2<head>
3 <title>文字从状态栏左边冒出</title>
4</head>
5<body>
6
7<script language="JavaScript">
8var msg = "状态栏文字从左一个一个冒出！！ " ;
9var interval = 120
10var spacelen = 120;
11var space10=" ";
12var seq=0;
13function Scroll() {
14len = msg.length;
15window.status = msg.substring(0, seq+1);
16seq++;
17if ( seq >= len ) {
18seq = 0;
19window.status = "";
20window.setTimeout("Scroll();", interval );
21}
22else
23window.setTimeout("Scroll();", interval );
24}
25Scroll();
26</script>
27</body>
28</html>
<html>2
<head>3
<title>文字从状态栏左边冒出</title>4
</head>5
<body>6
7
<script language="JavaScript"> 8
var msg = "状态栏文字从左一个一个冒出！！ " ; 9
var interval = 120 10
var spacelen = 120; 11
var space10=" "; 12
var seq=0; 13
function Scroll() { 14
len = msg.length; 15
window.status = msg.substring(0, seq+1); 16
seq++; 17
if ( seq >= len ) { 18
seq = 0; 19
window.status = ""; 20
window.setTimeout("Scroll();", interval ); 21
} 22
else 23
window.setTimeout("Scroll();", interval ); 24
} 25
Scroll(); 26
</script> 27
</body>28
</html> 3 文字在状态栏逐字放入
1<html>
2<head>
3 <title>文字在状态栏逐字放入</title>
4</head>
5<body>
6
7<script language="JavaScript">
8<!--
9function statusMessageObject(p,d) {
10 this.msg = MESSAGE
11 this.out = " "
12 this.pos = POSITION
13 this.delay = DELAY
14 this.i = 0
15 this.reset = clearMessage
16}
17function clearMessage() {
18 this.pos = POSITION
19}
20var POSITION = 100
21var DELAY = 4
22 var MESSAGE = "状态栏文字快速的一个一个弹出！！！ "
23var scroll = new statusMessageObject()
24function scroller() {
25 for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) {
26 scroll.out += " "
27 }
28 if (scroll.pos >= 0)
29 scroll.out += scroll.msg
30 else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length)
31 window.status = scroll.out
32 scroll.out = " "
33 scroll.pos--
34 if (scroll.pos < -(scroll.msg.length)) {
35 scroll.reset()
36 }
37 setTimeout ("scroller()",scroll.delay)
38}
39function snapIn(jumpSpaces,position) {
40 var msg = scroll.msg
41 var out = ""
42 for (var i=0; i<position; i++)
43 {out += msg.charAt(i)}
44 for (i=1;i<jumpSpaces;i++)
45 {out += " "}
46 out += msg.charAt(position)
47 window.status = out
48 if (jumpSpaces <= 1) {
49 position++
50 if (msg.charAt(position) == " ")
51 {position++ }
52 jumpSpaces = 100-position
53 } else if (jumpSpaces > 3)
54 {jumpSpaces *= .75}
55 else
56 {jumpSpaces--}
57 if (position != msg.length) {
58 var cmd = "snapIn(" + jumpSpaces + "," + position + ")";
59 scrollID = window.setTimeout(cmd,scroll.delay);
60 } else {
61 window.status=""
62 jumpSpaces=0
63 position=0
64 cmd = "snapIn(" + jumpSpaces + "," + position + ")";
65 scrollID = window.setTimeout(cmd,scroll.delay);
66 return false
67 }
68 return true
69}
70snapIn(100,0);
71// -->
72</script>
73
74</body>
75</html>
<html>2
<head>3
<title>文字在状态栏逐字放入</title>4
</head>5
<body>6
7
<script language="JavaScript"> 8
<!-- 9
function statusMessageObject(p,d) { 10
this.msg = MESSAGE 11
this.out = " " 12
this.pos = POSITION 13
this.delay = DELAY 14
this.i = 0 15
this.reset = clearMessage 16
} 17
function clearMessage() { 18
this.pos = POSITION 19
} 20
var POSITION = 100 21
var DELAY = 4 22
var MESSAGE = "状态栏文字快速的一个一个弹出！！！ " 23
var scroll = new statusMessageObject() 24
function scroller() { 25
for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) { 26
scroll.out += " " 27
} 28
if (scroll.pos >= 0) 29
scroll.out += scroll.msg 30
else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length) 31
window.status = scroll.out 32
scroll.out = " " 33
scroll.pos-- 34
if (scroll.pos < -(scroll.msg.length)) { 35
scroll.reset() 36
} 37
setTimeout ("scroller()",scroll.delay) 38
} 39
function snapIn(jumpSpaces,position) { 40
var msg = scroll.msg 41
var out = "" 42
for (var i=0; i<position; i++) 43
{out += msg.charAt(i)} 44
for (i=1;i<jumpSpaces;i++) 45
{out += " "} 46
out += msg.charAt(position) 47
window.status = out 48
if (jumpSpaces <= 1) { 49
position++ 50
if (msg.charAt(position) == " ") 51
{position++ } 52
jumpSpaces = 100-position 53
} else if (jumpSpaces > 3) 54
{jumpSpaces *= .75} 55
else 56
{jumpSpaces--} 57
if (position != msg.length) { 58
var cmd = "snapIn(" + jumpSpaces + "," + position + ")"; 59
scrollID = window.setTimeout(cmd,scroll.delay); 60
} else { 61
window.status="" 62
jumpSpaces=0 63
position=0 64
cmd = "snapIn(" + jumpSpaces + "," + position + ")"; 65
scrollID = window.setTimeout(cmd,scroll.delay); 66
return false 67
} 68
return true 69
} 70
snapIn(100,0); 71
// --> 72
</script> 73
74
</body>75
</html> 
扫一扫
2008
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
