我正在为我的网站制作一个简单的(至少我认为是)图像幻灯片。 我是jquery和javascript的新手,所以我的脚本可能有点狡猾。这是代码:
$(function(){
var images = ["images/animal_full_2.jpg","images/church_full_1.jpg", "images/city_full_2.jpg", "images/faith_full_1.jpg", "images/flower_full_2.jpg", "images/gloom_full_2.jpg"];
function swapImages()
{
images=0;
$("#"+images).fadeOut(2000,function(){
(this).attr('src',++images).fadeIn(2000,function(){
setTimeout(swapImages(),2000)
});
});
}
});
现在,我试图实现的是幻灯片放映,以便阵列中的图像定期更改,然后又重新开始,但这就是您可以看到的情况(请注意,通过包含URL我我不是试图宣传我的网站,而只是简单地说明脚本是如何工作的): http://antobbo.webspace.virginmedia.com/photogallery/testscript/home.htm 图像全部显示在主页上。 有没有人对如何使它工作有任何建议? 非常感谢
答案 0 :(得分:0)
到目前为止,你有什么问题,所以也许你只是看到一个有效的例子会更容易。这应该适用于您的文档:
$(function() {
var imgs = $('.home_page_pic img').hide(), index = 0;
imgs.eq(index).show();
function swapImages() {
imgs.eq(index).fadeOut(2000, function(){
index++;
if (index == imgs.length) {
index = 0;
}
imgs.eq(index).fadeIn(2000, swapImages);
});
}
swapImages();
});