jquery - Twitter Bootstrap Carousel 循环项目从右到左 (RTL) 反转

Question

如何将 Twitter Bootstrap Carousel cycle 功能更改为从右到左而不是从左到右循环项目，以便它在希伯来语/阿拉伯语网站中看起来正常？

Answer 1

只需使用类似的函数重写循环函数，调用 prev 而不是 next:

$(document).ready(function () {
    $('.carousel').each(function(){
        $(this).carousel();

        var carousel = $(this).data('bs.carousel'); // or .data('carousel') in bootstrap 2
        carousel.pause();

        // At first, reverse the order of the items in the carousel because we're moving backwards
        $(this).find('> .carousel-inner > .item:not(:first-child)').each(function() {
            $(this).prependTo(this.parentNode);
        });

        // Override the bootstrap carousel prototype function, adding a different one won't work (it'll work only for the first slide)
        carousel.cycle = function (e) {
            if (!e) this.paused = false
            if (this.interval) clearInterval(this.interval);
            this.options.interval
            && !this.paused
            && (this.interval = setInterval($.proxy(this.prev, this), this.options.interval))
            return this;
        };

        carousel.cycle();
    });
});