今天工作時, 為了要讓使用者可以看圖片瞭解要公告的事項, 所以改寫了跑馬燈的 Java Script, 程式如下:
<script language="JavaScript">
<!--
var t = 500; // 顯示的時間
var tt = 0;
var ttt = 0;
var isOnPic = false; => 判斷滑鼠是否在圖片上
var ry= 1;
function random_imglink(){
var myimages=new Array()
//以下放置要顯示的圖片.不夠的話自己加上
myimages[1]="image01.png"
myimages[2]="image02.png"
//以下放置圖片相對的網址.不夠的話自己加上
var imagelinks=new Array()
imagelinks[1]="http://tw.myblog.yahoo.com/polinwei/"
imagelinks[2]="http://polinwei.blogspot.com/2008/08/html.html"
// alt 浮現視窗要顯示的文字
var imagealt="new" Array()
imagealt[1]="我與小崴崴的生活日記"
imagealt[2]="用 HTML 語法讓圖片上也可以作連結"
var adv=document.getElementById("adv");
// 滑鼠若在圖片上時, 則不輪詢
if (!isOnPic){
ry=Math.floor(Math.random()*myimages.length);
}
if (ry==0) ry=1
adv.innerHTML = '<a onmouseover="isOnPic=true;" onmouseout="isOnPic=false;" href='+'"'+imagelinks[ry]+'"'+'target="_blank"><img src="'+myimages[ry]+'" width="530" height="250" border="0" alt=""'+imagealt[ry]+'">" </a>';
ttt = 5*t;
tt += ttt;
setTimeout("random_imglink()", ttt);
}
//-->
</script>
整個 HTML 檔案如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>資訊公告</title>
<script language="JavaScript">
<!--
var t = 500; // 顯示的時間
var tt = 0;
var ttt = 0;
var isOnPic = false; => 判斷滑鼠是否在圖片上
var ry= 1;
function random_imglink(){
var myimages=new Array()
//以下放置要顯示的圖片.不夠的話自己加上
myimages[1]="image01.png"
myimages[2]="image02.png"
//以下放置圖片相對的網址.不夠的話自己加上
var imagelinks=new Array()
imagelinks[1]="http://tw.myblog.yahoo.com/polinwei/"
imagelinks[2]="http://polinwei.blogspot.com/2008/08/html.html"
// alt 浮現視窗要顯示的文字
var imagealt="""new""" Array()
imagealt[1]="我與小崴崴的生活日記"
imagealt[2]="用 HTML 語法讓圖片上也可以作連結"
var adv=document.getElementById("adv");
// 滑鼠若在圖片上時, 則不輪詢
if (!isOnPic){
ry=Math.floor(Math.random()*myimages.length);
}
if (ry==0) ry=1
adv.innerHTML = '<a onmouseover="isOnPic=true;" onmouseout="isOnPic=false;" href='+'"'+imagelinks[ry]+'"'+'target="_blank"><img src="'+myimages[ry]+'" width="530" height="250" border="0" alt=""""'+imagealt[ry]+'">""" </a>';
ttt = 5*t;
tt += ttt;
setTimeout("random_imglink()", ttt);
}
//-->
</script>
</head>
<body>
<div name="adv" id="adv">
<script>
random_imglink();
</script>
</div>
</p>
</body>
</html>
沒有留言:
張貼留言