点击上一个 下一个 实现切换 这个效果怎么写啊 求大神 贴代码
1个回答
展开全部
以前写的,主要是把东西的名字放在一个数组里,改变name实现切换,加了淡出淡入的效果
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Roller</title>
<style type="text/css">
#img1{
position:absolute;
top:50px;
left:40px;
filter:alpha(opacity:30);
opacity:1;
}
#botton{
width:500px;
height:740px;
}
</style>
<script type="text/javascript">
//图像滚动
var timer=null;
function change1(Condite){
var alpha=100;
clearInterval(timer);
var images=["1.jpg","2.jpg","3.jpg","4.jpg"];
var img1=document.getElementById("botton");
var imgName=img1.name.split("_");
var i=imgName[1];
timer=setInterval(function(){
alpha-=10;
img1.style.opacity=alpha/100;
if(alpha==0){
if(Condite==1){
if(i==0){
i=images.length-1
}else{
i--
}
img1.src="image/"+images[i];
img1.name="image_"+i;
}else if(Condite==2){
if(i==images.length-1){
i=0
}else{
i++
}
img1.src="image/"+images[i];
img1.name="image_"+i;
}
clearInterval(timer);
var Intervals=setInterval(function(){
alpha+=10;
img1.style.opacity=alpha/100;
if(alpha==100){
clearInterval(Intervals);
}
},5)
}
},5);
}
</script>
</head>
<body>
<div id="img1">
<img alt="" id="botton" src="image/1.jpg" name="image_0">
</div>
<input type="button" value="上一张" onClick="change1(1)">
<input type="button" value="下一张" onClick="change1(2)">
</body>
</head>
追问
谢谢咯
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询