我有带有next / previus按钮的图片库,我希望在3秒后自动将图像更改为下一张图像。我该怎么做?这段代码用Javascript:
var ary=[
'images/image1.png',
'images/image2.jpg',
'images/image3.jpg',
'images/image4.jpg',
'images/image4.jpg',
'images/image4.jpg'
];
function Slide(id,ary,nu){
document.getElementById(id).src = ary[nu];
Slide[id] = {nu: nu};
}
function nextImage(id, ary, ud){
var nu = (Slide[id]&&Slide[id].nu?Slide[id].nu:0) + ud;
Slide(id, ary, Math.min(Math.max(nu, 0), ary.length-1));
}
感谢您的每一个答案。
答案 0 :(得分:3)
您可以执行以下操作 DEMO
<div class="image">
<img src="http://placehold.it/350x150">
</div>
<强> JS 强>
$(function () {
count = 0;
images = ["http://placehold.it/350x150/FF0000", "http://placehold.it/350x150/4A84EB", "http://placehold.it/350x150/45BAE4", "http://placehold.it/350x150"];
setInterval(function () {
count++;
$(".image img").fadeOut(400, function () {
var next = images[count % images.length];
$(this).attr('src', next).fadeIn(400);
});
}, 3000);
});