2012-10-27 来源:网络
【实例名称】
JS代码实现状态栏文字从右弹出
【实例描述】
状态栏的文字可以从不同方向弹出,实现不同的样式。本例实现从右边弹出文字的效果。
【实例代码】
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>标题页-学无忧(www.xue51.com)</title>
<script language="JavaScript">
var MESSAGE="支持伦敦奥运会,支持上海世博会 ";
//状态栏显示的文本
//弹出文本的主要方法
function snapIn(jumpSpaces,position)
{
var msg = MESSAGE;
var out = "";
//循环读取文本信息
for (var i=0; i<position; i++)
{out += msg.charAt(i);}
//生成100个空格
for (i=1;i<jumpSpaces;i++)
{out += " ";}
//依次读取文本信息
out += msg.charAt(position);
//在状态栏显示文本信息
window.status = out;
//实现从右边弹出文本的方法
if (jumpSpaces <= 1) {
position++;
if (msg.charAt(position) == ' ')
{position++; }
jumpSpaces = 100-position;
}
else if (jumpSpaces > 3)
{jumpSpaces *= .75;}
else
{jumpSpaces--;}
if (position != msg.length) {
var cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
//根据定时器,循环弹出文本
} else {
window.status="";
jumpSpaces=0;
position=0;
cmd = "snapIn(" + jumpSpaces + "," + position + ")";
scrollID = window.setTimeout(cmd,scroll.delay);
return false; }
return true;
}
snapIn(100,0);
</script>
</head>
<body>
</body>
</html>
【运行效果】

【难点剖析】
本例的重点是状态栏的文字显示。IE中的状态栏使用window对象的“status’’属性:从右边弹出文字主要是依靠位置的变化,使用“100一position”的方法从右边往左边显示文字。
【源码下载】
如果你不愿复制代码及提高代码准确性,你可以点击:JS代码实现状态栏文字从右弹出 进行本实例源码下载