Javascript圖片輪播
貼在<head>--</head>
以下為《JS》原始碼
貼在<body>--</body>
以下為《XML》原始碼
貼在<head>--</head>
以下為《JS》原始碼
<script type="text/javascript">
/*
置換網頁的輪播圖片
使用的網頁須建立一個image
<img id="pimg" src="http://s.blog.xuite.net/_image/emotion/hastart/m167.gif" height="200px" width="200px">
*/
var t,t1,t2; //時間物件
var classpic=new Array();
var imgsrc=new Array();
var i=1;
/*****編輯敘述開始****/
/*順序由 1.jpg 開始....*/
imgsrc[i]="http://s.blog.xuite.net/_image/emotion/hastart/m155.gif";classpic[i]="文字一";i++;
imgsrc[i]="http://s.blog.xuite.net/_image/emotion/hastart/m156.gif";classpic[i]="文字2";i++;
imgsrc[i]="http://s.blog.xuite.net/_image/emotion/hastart/m157.gif";classpic[i]="文字3";i++;
imgsrc[i]="http://s.blog.xuite.net/_image/emotion/hastart/m158.gif";classpic[i]="文字4";i++;
imgsrc[i]=
"http://s.blog.xuite.net/_image/emotion/hastart/m159.gif";classpic[i]="文字5";i++;
//****編輯敘述結束****/
var indexstar=1;
var indexMax=classpic.length-1;
var index=Math.round(Math.random()*indexMax)+indexstar;
var imgpath="../news/imgs/";
function cc()
{
if(index>indexMax)
{
index=1;
}
var pimg=document.getElementById("pimg");
var RevealTrans_index=Math.round(Math.random()*23)+1;
pimg.style.filter="RevealTrans(duration=1,transition="+RevealTrans_index+")";
pimg.filters.RevealTrans.Apply();
//pimg.src=imgpath+index+".jpg";
pimg.src=imgsrc[index];
var div1=document.getElementById("div1");
div1.innerHTML=classpic[index];
index++;
pimg.filters.RevealTrans.play();
}
function gogo()
{
t=setInterval('cc()',2000);//輪播時間 1000等於1秒
}
gogo();
//clearTimeout(t);
</script>
貼在<body>--</body>
以下為《XML》原始碼
<p>
<img id="pimg" alt="" width="100" height="100" src="http://s.blog.xuite.net/_image/emotion/hastart/m155.gif" />
</p>
<div style="width: 100px; height: 100px" id="div1">ya</div>