时间戳

首页 > 解决方案 > 在 Vegas 滑块中添加上一个/下一个按钮

javascript - 在 Vegas 滑块中添加上一个/下一个按钮

问题描述

我有一个简单的滑块，可以滑动几张图片并使用Vegas JS. 这就是我所拥有的

<section class="slider fullwidth">

   <div class="caption"></div>

   <div id="buttons">
      <a href="#" id="previous"></a>
      <a href="#" id="next"></a>    
   </div>
</section>
$(".slider").vegas({
      slides: [
          { src: "slide-1.jpg", text: "Text 1" },
          { src: "slide-2.jpg", text: "Text 2" }
      ],
      walk: function (index, slideSettings) {
          $('.caption').html(slideSettings.text);
      }
});

$('#previous').on('click', function () {
    $elmt.vegas('options', 'transition', 'slideRight2').vegas('previous');
});

$('#next').on('click', function () {
    $elmt.vegas('options', 'transition', 'slideLeft2').vegas('next');
});

上面的代码生成了滑块，两张幻灯片+标题都更改了，但按钮不起作用。

当我单击 Next 或 Previous 时，我在控制台中得到的错误是

未捕获的 ReferenceError：未定义 $elmt

我试图在这里遵循他们的文档：https ://vegas.jaysalvat.com/documentation/methods/

标签： javascriptslidervegasjs

解决方案

而不是$elmt.vegas尝试使用$(".slider").vegas

推荐阅读