管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

图片轮换效果实现代码(点击按钮停止执行)

　　在这个小程序中，需要把images文件夹下图片的命名设置为有顺序的，1、2、3……

　　

复制代码 代码如下:

　　<script type="text/javascript">

　　var imgnumb = 1;

　　function imgfor() {

　　imgnumb++;

　　document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');

　　if (imgnumb == 5) { //共5张图片

　　imgnumb = 0;

　　}

　　}

　　var clearid;

　　function clearfun() {

　　clearInterval(clearid);

　　}

　　clearid=setInterval(imgfor, 500);

　　</script>

　　</head>

　　<body>

　　<img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />

　　<input type="button" value="结束执行" onclick="clearfun();" />

　　</body>

　　var imgnumb = 1;

　　function imgfor() {

　　imgnumb++;

　　document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');

　　if (imgnumb == 5) {

　　imgnumb = 0;

　　}

　　}

　　var clearid;

　　function clearfun() {

　　clearInterval(clearid);

　　}

　　clearid=setInterval(imgfor, 500);

　　</script>

　　</head>

　　<body>

　　<img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />

　　<input type="button" value="结束执行" onclick="clearfun();" />

　　</body>

教程首页 更多教程