如何用JS控制一张一张显示图片

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>work center</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<link rel="stylesheet" type="text/css" href="left.css">
<SCRIPT LANGUAGE="JavaScript">
<!--
//将需要逐个显示的图片名称存入数组.
urlarray=new Array('5xsoft','access2','access3','access4','file_search','file_browse','sbz','sbz2','shang','shanghz','shangmx','selectcenter','soft')

var i=0;    //这几个变量最好定义在外面，我测试过，对象重复定义会极大地降低性能
var nextid=0;
var previousid=0;
var mpc=""; //图片
var url=""; //地址
var ln=0;
function showpic(gotourl)
{
ln=urlarray.length;
for(i=0;i<urlarray.length;i++)
{
if(urlarray[i]==gotourl)
break;
}
if(i>0){previousid=(i-1)%ln;}
else{previousid=ln-1}
nextid=(i+1)%ln;

url=gotourl+".jpg";
mpc="<IMG name=mainpic SRC='"+url+"' BORDER=0><BR>";
//alert(mpc);
btn2="<input type=button value=previous name=previous onclick=javascript:showpic('"+urlarray[previousid]+"')>&nbsp;&nbsp;&nbsp;&nbsp;";
btn3="<input type=button value=next name=next onclick=javascript:showpic('"+urlarray[nextid]+"')>";

//alert(mpc+btn2+btn3)
maininfo.innerHTML=mpc+btn2+btn3;

}
//-->
</SCRIPT>
<BODY>
<TABLE border=20>
<TR>
 <TD id="maininfo" name="maininfo">
 <IMG name="mainpic" SRC="5xsoft.jpg" BORDER="0" ALT=""><BR>
<input type="button" value="previous" name="previous">
<input type="button" value="next" name="next"  onclick="javascript:showpic('access2')">
 </TD>
</TR>
</TABLE>
</BODY>
</HTML>

Posted on 2005-03-04 21:49  古代  阅读(858)  评论(0)    收藏  举报