手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >图片轮换效果实现代码(点击按钮停止执行)
图片轮换效果实现代码(点击按钮停止执行)
摘要:在这个小程序中,需要把images文件夹下图片的命名设置为有顺序的,1、2、3……复制代码代码如下:varimgnumb=1;functio...

在这个小程序中,需要把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" src="images/1.jpg" width="500px" height="500px" />

<input type="button" value="结束执行" />

</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" src="images/1.jpg" width="500px" height="500px" />

<input type="button" value="结束执行" />

</body>

【图片轮换效果实现代码(点击按钮停止执行)】相关文章:

JavaScript实现表格点击排序的方法

如何实现浏览器上的右键菜单

打印/预览/设置的客户端代码

node.js微信公众平台开发教程

图片完美缩放

多种js图片预加载实现方式分享

JQuery+CSS实现图片上放置按钮的方法

javascript实现图片跟随鼠标移动效果的方法

js实现精美的图片跟随鼠标效果实例

js实现仿Windows风格选项卡和按钮效果

精品推荐
分类导航