如何在jQuery中传递和设置滑块图像显示时间



我使用了一个图像滑块。它的HTML和jQuery代码如下:

HTML代码:

<div class="leaderboard">
  <ul id="demo1">
    <li><a href="#slide1"><img src="img/Slid1.png" alt="Lorem Ipsum"></a></li>
    <li><a href="#slide2"><img src="img/Slid2.png"  alt="Lorem Ipsum"></a></li>
    <li><a href="#slide3"><img src="img/slid3.png" alt="Lorem Ipsum"></a></li>
  </ul>
</div>

jQuery代码:

$(function() {
  var demo1 = $("#demo1").slippry({
    transition: 'fade',
    useCSS: true,
    speed: 1000,
    pause: 3000,
    auto: true,
    preload: 'visible'
  });
  $('.stop').click(function () {
    demo1.stopAuto();
  });
  $('.start').click(function () {
    demo1.startAuto();
  });
  $('.prev').click(function () {
    demo1.goToPrevSlide();
    return false;
  });
  $('.next').click(function () {
    demo1.goToNextSlide();
    return false;
  });
  $('.reset').click(function () {
    demo1.destroySlider();
    return false;
  });
  $('.reload').click(function () {
    demo1.reloadSlider();
    return false;
  });
  $('.init').click(function () {
    demo1 = $("#demo1").slippry();
    return false;
  });
});

已经包含了必要的jQuery和CSS文件。

这个图像滑块非常适合我。但现在我想设置一些以秒为单位的值(例如5秒。这是一个可变值,也可以不是5秒。),这个滑块中的每个图像都会显示。换句话说,我想显示每个图像5秒,一旦5秒完成,下一个图像就会出现。

我应该如何将这个5秒的值传递给上面的jQuery滑块函数,并将这个值用于一个函数中,以便滑块中的每个图像都显示5秒?

感谢您花费宝贵的时间来理解我的问题。如果你需要更多关于这个问题的信息,请告诉我。

任何形式的hep都将不胜感激。等待您宝贵的答复。

对于最后5秒的幻灯片,更改值

var demo1 = $("#demo1").slippry({
    transition: 'fade',
    useCSS: true,
    speed: 1000,
    pause: 5000,// changed from 3000(3s) 
    auto: true,
    preload: 'visible'
});

你可以在这里获得更多信息http://slippry.com/settings/

编辑2

你需要做一些类似的事情

JS Fiddle

相关内容

  • 没有找到相关文章

最新更新