jquery/javascript图片幻灯片

我正在一个简单的（至少我以为它是）我的网站的图像幻灯片。我是jquery和javascript的新手，所以我的脚本可能有点狡猾。下面的代码：jquery/javascript图片幻灯片

$（函数（）{

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 图像全部显示在主页上。有没有人有任何建议如何让它工作？非常感谢

来源

2011-10-09 sami

有几个jquery插件提供此功能。为什么重新发明轮子？ – markijbema

自己写作是一种学习的好方法。 – Jack

取决于你有多少时间，如果你有时间我也可以投票自己去学习它，但是在很多情况下，当时间紧迫时，你会提出这个问题，客户在你的脖子上呼吸，这是在那些我赞美那些它在我之前:) – Sander

到目前为止，您的工作有几个问题，因此您可能会更容易看到一个工作示例。这应该与您的文档：

$(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(); 
});

来源

2011-10-09 22:03:24 Jack

谢谢你！有几件事情不清楚：1）当你说“imgs.length”时，它有价值5.那是什么？ 2）在这一行imgs.eq（index）.fadeIn（2000，swapImages）;在这一行中，我们认为长度返回字符串中的字符串的数量。 swapImages是一个回调函数。为什么我们需要它？从我读的回调函数那里阻止另一个函数在动画之前运行。所以为什么你使用它。 3）在脚本结尾再次调用swapImages（）：为什么要这样做？ – sami

杰克对不起刚刚注意到一些东西。第一次运行图片时，脚本不起作用。后来的运行是好的，看看：http://antobbo.webspace.virginmedia.com/photogallery/home.htm – sami

这与您发布的原始页面完美结合。我在你的网站上打开了一个JS控制台并进行了测试。 – Jack

jquery/javascript图片幻灯片

回答

相关问题