首页 > 解决方案 > 如何在 JtaCarousel Jquery 中更改滑动时间(自动播放)?

问题描述

我正在使用 Jquery 插件来创建 jtacarousel 横幅。我不知道如何将滑块的自动播放更改为 8 秒。这是该插件的链接:

https://www.jqueryscript.net/slider/Responsive-Auto-rotating-Banner-Carousel-Plugin-With-jQuery-jtaCarousel.html

或者 JQuery 代码在这里

function jtaCarousel(a) {
function u(a) {
    $(d).hasClass(p) && $(a).each(function() {
        timer = setInterval(function() {
            $(a).animate({
                marginLeft: n
            }, b, function() {
                $(a).find(l).after($(a).find(k)), $(a).css({
                    marginLeft: 0
                })
            }), r == s ? (r = 0, $(h).removeClass("selected"),       $(h).first().addClass("selected")) : $(g).find(".selected").each(function() {
                $(this).removeClass("selected").next(h).addClass("selected")
            }), r = r += 1
        }, c)
    })
}

function v() {
    $(e).click(function() {
        $(d).removeClass(p), clearInterval(timer), $(d).hasClass(q) || ($(d).addClass(q), $(d).animate({
            marginLeft: n
        }, b, function() {
            $(d).find(l).after($(d).find(k)), $(d).css({
                marginLeft: 0
            })
        }), $(g).find(".selected").each(function() {
            $(this).removeClass("selected").next(h).addClass("selected")
        }), r > s - 1 && (r = 0, $(h).removeClass("selected"), $(h).first().addClass("selected")), r = r += 1, setTimeout(function() {
            $(d).removeClass(q)
        }, b))
    }), $(f).click(function() {
        $(d).removeClass(p), clearInterval(timer), $(d).hasClass(q) || ($(d).addClass(q), $(d).find(k).before($(d).find(l)), $(d).css({
            marginLeft: n
        }), $(d).animate({
            marginLeft: o
        }, b), $(g).find(".selected").each(function() {
            $(this).removeClass("selected").prev().addClass("selected")
        }), 5 == r ? r = r -= 1 : 1 == r ? (r = 5, $(h).removeClass("selected"), $(h).last().addClass("selected")) : r = r -= 1, setTimeout(function() {
            $(d).removeClass(q)
        }, b))
    })
}
var b = 1e3,
    c = 4e3,
    d = a,
    e = ".banner-next",
    f = ".banner-prev",
    g = ".banner-location",
    h = ".banner-indicator",
    i = h + ":first",
    j = ".banner-item",
    k = j + ":first",
    l = j + ":last",
    m = $(j).outerWidth(),
    n = "-=" + m,
    o = "+=" + m,
    p = "active",
    q = "disabled",
    r = 1,
    s = $(j).length;
$(window).resize(function() {
    m = $(j).outerWidth(), n = "-=" + m, o = "+=" + m
}), $(d).addClass(p), $(j).each(function() {
    $(g).append('<div class="banner-indicator"></div>')
});
$(h).length;
$(i).addClass("selected"), $(d).hover(function() {
    clearInterval(timer)
}, function() {
    u(d)
}), u(d), v()
}
jtaCarousel(".banner");

标签: jqueryhtmlcsscarouselresponsive

解决方案


欢迎来到 StackOverflow。

从您的代码中,变量 'c' ( c = 4e3,) 管理速度。你可以改变价值c = 16000


推荐阅读