图像库全屏图像...$. vegas（'幻灯片'）

Question

我们目前正在一个网站上使用全屏图像幻灯片，初始测试非常有效，下面的代码显示了它的工作原理：

$.vegas( 'slideshow' , {
    backgrounds:[
    { src:'/uploads/images/1397/lmwp_02.jpg', fade:1000 },
    { src:'/uploads/images/1397/lmwp_03.jpg', fade:1000 },
    { src:'/uploads/images/1397/lmwp_04.jpg', fade:1000 }
    ]
})('overlay');

我们要做的是从CSM动态地写入图像。我现在做的是列出一个简单的列表，如下所示：

<ul id="homeSlides">    
    <li><a href="/uploads/images/001.jpg">001</a></li>
    <li><a href="/uploads/images/002.jpg">002</a></li>
</ul>

我们需要做的是获取此图像列表并将其注入到$.vegas backgrounds:[]函数列表中。。。

我已经尝试了下面的代码，可以得到图像列表，但我不确定您将如何将其放入$. vegas函数：

var homeImgURLs = [];
    $('#homeSlides li a').each(function(index) {
    homeImgURLs.push('{ src:' + $(this).attr('href') + ', fade:1000}');
});

因此，这里的职位。非常感谢您的帮助。

Answer 1

像这样的东西应该可以做到：

var homeImgURLs = [];
$('#homeSlides li a').each(function(index) {
  homeImgURLs.push({
    src: $(this).attr('href'),
    fade: 1000
  });
});

$.vegas( 'slideshow' , {
  backgrounds: homeImgURLs
})('overlay');

在您的示例中，当您要推送对象时，您正在将字符串推送到homeImgURLs数组中。