Question

我需要初始背景图像在幻灯片开始运行之前保持可见一段时间。如何延迟幻灯片开始的那一刻？

我认为应该可以使用setTimeout方法，但无法弄清楚究竟如何。

这是代码：

<script type="text/javascript">
$(function() {
$.vegas({
loading:true,
src:'vegas/images/bg1_1.jpg'
});

$.vegas('slideshow', {
delay:6000,
backgrounds:[
{ src:'vegas/images/1_1.jpg', fade:1000,},
{ src:'vegas/images/2_1.jpg', fade:1000,},
{ src:'vegas/images/3_1.jpg', fade:1000,}
]
});
});
</script>

谢谢！

Answer 1

为了使用setTimeout，将幻灯片初始化脚本放在一个函数中，并为该函数命名为＆＃34; startSlideshow＆＃34;：

function startSlideshow() {
    // slideshow code goes here
}

然后，配置超时以在指定的延迟后调用该函数：

setTimeout(startSlideshow,3000);

以下示例：

＆＃13;

function startSlideshow() {

  // remove pre-slideshow message
  $('p.message').remove();

  // start slideshow
  $.vegas('slideshow', {
    delay: 6000,
    backgrounds: [{
      src: 'http://lorempixel.com/400/200',
      fade: 1000,
    }, {
      src: 'http://lorempixel.com/300/200',
      fade: 1000,
    }, {
      src: 'http://lorempixel.com/400/250',
      fade: 1000,
    }]
  });

}

$(function() {
  setTimeout(startSlideshow, 3000);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://vegas.jaysalvat.com/js/vegas/jquery.vegas.css">
<script type="text/javascript" src="http://vegas.jaysalvat.com/js/vegas/jquery.vegas.js"></script>

<p class="message">Slideshow starts in 3 seconds...</p>

＆＃13;

Vegas幻灯片插件 - 如何延迟幻灯片开始的那一刻？

1 个答案: