代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<style type="text/css">
#divall {
position:relative;
}
#divleft {
border:1px red solid;
border-right:0px red solid;
background: url(bg.gif);
cursor:url("2.cur");
position:absolute;
top:0px;
z-index:2007;
text-align:right;
padding:0px
}
#divright {
border:1px red solid;
border-left:0px red solid;
background: url(bg.gif);
cursor:url("1.cur");
top:0px;
position:absolute;
z-index:2007
text-align:center;
padding:0px
}
#tu{z-index:-2007}
</style>
</head>
<script type="text/javascript">
var zhang=2;
function next(){
if(zhang==8){
alert("这已经是最后一张了!");
zhang=7;
}
document.getElementById("tu").src=zhang+".jpg";
text.innerHTML="当前是第"+zhang+"张图片";
zhang++;
}
function up(){
if(zhang==2){
alert("这已经是第一张了!");
zhang=3;
}
document.getElementById("tu").src=+(zhang-2)+".jpg";
text.innerHTML="当前是第"+(zhang-2)+"张图片";
zhang--;
}
function defaultLoad(){
var w=document.getElementById("tu").width;//auto
var h=document.getElementById("tu").height;//auto
document.getElementById("tu").style.width=w;
document.getElementById("tu").style.height=h;
//document.getElementById("divleft").style.visibility='hidden' document.getElementById("divleft").style.width=w/2;
document.getElementById("divleft").style.height=h;
document.getElementById("divleft").style.left=0;
//document.getElementById("divright").style.visibility='hidden' document.getElementById("divright").style.width=w/2; document.getElementById("divright").style.height=h;
document.getElementById("divright").style.left=w/2;
}
//document.write("<style> #tu{width:"+w+"px;
height:"+h+"px;z-index:2000}</style>")
function show_div(id,img){
document.getElementById(id).innerHTML="<img src="+img+">";
}
function hide_div(id){
document.getElementById(id).innerHTML="";
}
</script>
<body onload="defaultLoad()" >
<form id="form1" runat="server" >
<div id="text" >当前是第1张图片</div>
<div id="divall">
<img src="image/1.jpg" id="tu" alt="图片" />
<div id="divleft" title="上一张"
onmouseover="show_div('divleft','left.gif')" onmouseout="hide_div('divleft')" onclick="up()" >
</div>
<div id="divright" title="下一张
" onmouseover="show_div('divright','right.gif')" onmouseout="hide_div('divright')" onclick="next()"> </div>
</div>
</form>
</body>
</html>。