如何使用 vegas.js 插件添加文本动画

我正在使用 vegas.js 插件（http://vegas.jaysalvat.com/documentation） 对于我的网站。我想用这些图像显示一些文本。我如何添加一些带有图像的动画文本。

在 body 中初始化 vegas.js：

<script>
    $("#fullScreenSlide").vegas({
        preload : true,/*load then show image*/
        autoplay: true,
        loop: true,
        shuffle: false,
        cover: true,
        transition: 'fade', /*animation-effect*/
        transitionDuration: 5000, /*animation duration*/
        delay: 12000, /*slide duration*/

    slides: [
      { src: "images/1.jpg" },
      { src: "images/2.jpg" },
      { src: "images/3.jpg" },
      { src: "images/4.jpg" }
    ],
        overlay: 'vegas/overlays/01.png' /*overlay background*/
    });
    </script>

而不是编辑vegas.js or vegas.min.js依赖文件：

向幻灯片添加另一个参数，例如text or overlayText，像这样：

{ src: "/images/1.jpg", text: "Text for slider 1." },
{ src: "/images/2.jpg", text: "Text for slider 2." }

确保你创建的元素具有可识别性id or class例如：

<div id="vegasSliderInner"></div>

现在只需添加一个walk滑块的函数参数，它有一个html追加功能。

（完整代码）：

<script>
    $("#fullScreenSlider").vegas({
        preload : true,/*load then show image*/
        autoplay: true,
        loop: true,
        shuffle: false,
        cover: true,
        transition: 'fade', /*animation-effect*/
        transitionDuration: 5000, /*animation duration*/
        delay: 12000, /*slide duration*/
        overlay: 'vegas/overlays/01.png' /*overlay background*/

        slides: [
            { src: "/images/1.jpg", text: "Text for slider 1." },
            { src: "/images/2.jpg", text: "Text for slider 2." },
            { src: "/images/3.jpg", text: "Text for slider 3." },
            { src: "/images/4.jpg", text: "Text for slider 4." }
        ],

        walk: function (index, slideSettings) {
            $('#vegasSliderInner').html(slideSettings.text);
        }
    });
</script>