javascript - 创建可变长度幻灯片显示的幻灯片

Question

尝试使用 slides.js jquery 插件创建幻灯片。

我想要的是第一张幻灯片(其中嵌入了视频)显示 7 秒，其余幻灯片每张显示 4 秒。

这是我目前尝试过的:

  $(function(){
      $('#slides').slides({
          preload: true,
          generateNextPrev: false,
          play: function(){
              if($('#slides').childNodes[2].css('display', 'block')){
                   return 7000;
              } else {
                   return 4000;
              } 
          }
      });
      $("#menu select").change(function() {
          window.location = $(this).find("option:selected").val();
      });
  });

起初我以为每次幻灯片更改时都会运行此函数。我现在意识到这个匿名函数运行一次就完成了。这意味着它不会返回查看该幻灯片是否不是 display: block; 或 display: none;。这让我不知道该怎么办。

我检查了 slides.js 页面上的文档，但没有看到任何突出的帮助。

TLDC:是否可以使用 slides.js 来改变显示时间的长度？如果不是，我可以使用什么？

Answer 1

使用 slides.js 似乎不太可能轻松，所以让我介绍一下我自己的名为 Do It Yourself Slider 的 jQuery slider 。 .

This plugin is a foundation on which you’ll build a slider yourself, one that really fits your needs.

因此你可以做任何你想做的事，因为你必须自己做:你不受插件的限制。

看看 demo我按照您的要求制作了第一张幻灯片，持续 7 秒，而其他幻灯片持续 4 秒。