当前页面: 开发资料首页 → Javascript 专题 → 用JavaScript来控制状态栏
用JavaScript来控制状态栏
摘要: 用JavaScript来控制状态栏
把以下代码放在<head></head>之间：
<script language="JavaScript">
<!-- Hide
var speed = 10
var pause = 1500
var timerID = null
var bannerRunning = false
var ar = new Array()
ar[0] = "MESSAGE #1"
ar[1] = "MESSAGE #2"
ar[2] = "MESSAGE #3"
ar[3] = "MESSAGE #4"
var message = 0
var state = ""
clearState()
function stopBanner() {
if (bannerRunning)
clearTimeout(timerID)
bannerRunning = false
}
function startBanner() {
stopBanner()
showBanner()
}
function clearState() {
state = ""
for (var i = 0; i < ar[message].length; ++i) {
state += "0"
}
}
function showBanner() {
if (getString()) {
message++
if (ar.length <= message)
message = 0
clearState()
timerID = setTimeout("showBanner()", pause)
bannerRunning = true
} else {
var str = ""
for (var j = 0; j < state.length; ++j) {
str += (state.charAt(j) == "1") ? ar[message].charAt(j) : " "
}
window.status = str
timerID = setTimeout("showBanner()", speed)
bannerRunning = true
}
}
function getString() {
var full = true
for (var j = 0; j < state.length; ++j) {
if (state.charAt(j) == 0)
full = false
}
if (full)
return true
while (1) {
var num = getRandom(ar[message].length)
if (state.charAt(num) == "0")
break
}
state = state.substring(0, num) + "1" + state.substring(num + 1, state.length)
return false
}
function getRandom(max) {
return Math.round((max - 1) * Math.random())
}
// -->
</script>
把以下代码放在<body>中：
<body onLoad="startBanner()">
2、文本变换
把以下代码放在<head></head>之间：
<script language="JavaScript">
function update(msg) {
var pad_str="";
n = msg.length;
if(n<81) {
pad = (81-n)/2;
for(var i=0; i<pad; i++) {
pad_str+=" ";
}
}
CurrentMsg = pad_str + msg;
document.messages.field.value = CurrentMsg;
clearTimeout(timer);
timer = setTimeout("idleMsg()",5000);
}
function MakeArray(n) {
this.length=n;
for(var i = 1; i<= n; i++) {
this[i] = "";
}
return(this);
}
var index = 1;
var notice_num = 4;
var notices = new MakeArray(notice_num);
notices[1] = "MESSAGE #1";
notices[2] = "MESSAGE #2";
notices[3] = "MESSAGE #3";
notices[4] = "MESSAGE #4";
function idleMsg() {
update(notices[index++]);
if(index>notice_num) { index=1; }
}
</script>
把以下代码放在HTML文件任意地方：
<form name="messages" onSubmit="return false">
<input type="text" name="field" size=60 height=5 value="">
</form>
3、状态栏闪烁文字
把以下代码放在<head></head>之间：
<script>
var yourwords = "Welcome to Ahao'HomePage";
var speed = 300;
var control = 1;
function flash()
{
if (control == 1)
{
window.status=yourwords;
control=0;
}
else
{
window.status="";
control=1;
}
setTimeout("flash()",speed);
}
</script>
把以下代码放在<body>tag：
<body onLoad="flash()">
4、编辑框滚动文字
把以下代码放在<head></head>之间：
<script language="JavaScript">
<!-- Hide
var timerID = null;
var timerRunning = false;
var id,pause=0,position=0;
function ticker() {
var i,k,msg="YOUR MESSAGE GOES HERE";
k=(30/msg.length)+1;
for(i=0;i<=k;i++) msg+=" "+msg;
document.form2.ticker.value=msg.substring(position,position+30);
if(position++==38) position=0;
id=setTimeout("ticker()",1000/10); }
function action() {
if(!pause) {
clearTimeout(id);
pause=1; }
else {
ticker();
pause=0; } }
//-->
</script>
把以下代码放在<body>中：
<body onLoad="ticker()">
5、状态栏跑马灯效果
把以下代码放在<head></head>之间：
<SCRIPT LANGUAGE="JavaScript">
<!--
var speed = 50
var pause = 2000
var timerID = null
var bannerRunning = false
var ar = new Array()
ar[0] = "MESSAGE #1"
ar[1] = "MESSAGE #2"
ar[2] = "MESSAGE #3"
ar[3] = "MESSAGE #4"
var currentMessage = 0
var offset = 0
function stopBanner() {
if (bannerRunning)
clearTimeout(timerID)
bannerRunning = false
}
function startBanner() {
stopBanner()
showBanner()
}
function showBanner() {
var text = ar[currentMessage]
if (offset < text.length) {
if (text.charAt(offset) == " ")
offset++
var partialMessage = text.substring(0, offset + 1)
window.status = partialMessage
offset++
timerID = setTimeout("showBanner()", speed)
bannerRunning = true
} else {
offset = 0
currentMessage++
if (currentMessage == ar.length)
currentMessage = 0
timerID = setTimeout("showBanner()", pause)
bannerRunning = true
}
}
// -->
</SCRIPT>
把以下代码放在<body>中：
<body onLoad="startBanner()">
↑返回目录
前一篇: 用JavaScript实现一些随机事件
后一篇: 用JavaScript制作站内搜索