Javascript 在Vegas滑块中添加上一张和下一张幻灯片的按钮

我用Vegas Slideshow创建了一个非常简单的滑块。现在我尝试添加简单的上一个/下一个按钮。这是滑块

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


    <script src="/assets/js/jquery-3.4.0.min.js"></script>
    <script src="/assets/js/vegas.min.js"></script>
    <script>
        $(".slider-wrapper").vegas({
            slides: [
                { src: "/assets/images/slide-1.jpg", text: "Deployment" },
                { src: "/assets/images/slide-1.jpg", text: "Deployment" },
            ],
            walk: function (index, slideSettings) {
                $('.slide-caption').html(slideSettings.text);
            }
        });
    </script>

$（“.slider wrapper”）.vegas({
幻灯片：[
{src:“/assets/images/slide-1.jpg”，文本：“部署”}，
{src:“/assets/images/slide-1.jpg”，文本：“部署”}，
],
漫游：功能（索引、幻灯片设置）{
$（'.slide caption'）.html（slideSettings.text）；
}
});

这很好用。它显示了下面的图像和标题

现在，我尝试为按钮添加此选项，但页面上没有显示任何内容。控制台中没有错误。我也不确定是否需要为按钮添加HTML，或者是从Vegas的JS和CSS中提取它们

    <script>
        $(".slider-wrapper").vegas({
            slides: [
                { src: "/assets/images/slide-1.jpg", text: "Deployment" },
                { src: "/assets/images/slide-1.jpg", text: "Deployment" },
            ],
            walk: function (index, slideSettings) {
                $('.slide-caption').html(slideSettings.text);
            }
        });

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

        $('a#next').on('click', function () {
            $elmt.vegas('options', 'transition', 'slideLeft2').vegas('next');
        });
    </script>

$（“.slider wrapper”）.vegas({
幻灯片：[
{src:“/assets/images/slide-1.jpg”，文本：“部署”}，
{src:“/assets/images/slide-1.jpg”，文本：“部署”}，
],
漫游：功能（索引、幻灯片设置）{
$（'.slide caption'）.html（slideSettings.text）；
}
});
//钮扣
$（'a#previous'）。在（'click'，函数（）{
$elmt.vegas（'options'、'transition'、'slideRight2'）。vegas（'previous'）；
});
$（'a#next'）。在（'click'，函数（）{
$elmt.vegas（'options'、'transition'、'slideLeft2'）。vegas（'next'）；
});

---

有人知道我如何准确地添加按钮吗？

我还没有测试过这个，但它可能会让你朝着正确的方向前进

HTML...
<div id="previous" class="button"></div>
<div id="next" class="button"></div>


JQUERY...
    <script>
    $("#previous").click( function() {
$elmt.vegas('options', 'transition', 'slideRight2').vegas('previous');
});

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

</script>       
CSS...
.button {
display: block;
height: 100px;
width: 100px;
background-color: purple;
 }

HTML。。。
JQUERY。。。
$（“#上一个”）。单击（函数（）{
$elmt.vegas（'options'、'transition'、'slideRight2'）。vegas（'previous'）；
});
$（“#下一步”）。单击（函数（）{
$elmt.vegas（'options'，'transition'，'slideRight2'）。vegas（'next'）；
});
CSS。。。
.按钮{
显示：块；
高度：100px；
宽度：100px；
背景颜色：紫色；
}

您可以跳过link元素，只需为按钮创建一个div元素。。。jquery选择器从$（'a#previous）.on切换到$（'a#previous'）。click@KevMoe你能指给我看吗。。似乎我无法让它工作。我只看到“下一步”按钮和控制台中的此错误

ReferenceError:$elmt未定义

我不熟悉vegasjs。。。在我看来，它需要在该文档中定义。