基础代码请参考上篇文章(下方前后链接中)
改进代码:
HTML部分:
<div id="imgvalue" style="display:none">1</div>
<img src="image/01.jpg" id="img" onclick="gonext()"/>
<div id="abcd" name="" align="center">
图片欣赏1
</div>
javascript部分:
<script>
var i =0;
function $(id){
return document.getElementById(id);
}
function add(){
i++;//自增变化
$("img").src="image/0"+i+".jpg";//实现对img.src属性控制
$("imgvalue").innerText=i;
$("abcd").innerText="图片欣赏"+i;
if(i>2){ //注意控制图片数量
i=1;
}
setTimeout('add()',3000); //定时器控制播放时间
}
function gonext(){
a=$("imgvalue").innerText;
b=parseInt(a)+1;
$("img").src="image/0"+b+".jpg";
}
add();//调用函数
</script>