图片轮换效果实现代码(点击按钮停止执行) |
本文标签:图片轮换,停止按钮 在这个小程序中,需要把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> |