Owl Carousel不使用方向RTL

Question

猫头鹰轮播滑块不适用于RTL.我添加rtl: true了配置.但它没有加载滑块.滑块空间在那里并显示导航.但只显示滑块内容.我该如何解决这个问题？

我的代码如下:

<div class="row" id="brand-slider">
    <div class="item">
        <a href="#">
        <img src="{base_url()}assets/upload/brands/{$v.image}" class="img-responsive img-centered" alt="{$v.name}">
        </a>
    </div>
    <div class="item">
        <a href="#">
        <img src="{base_url()}assets/upload/brands/{$v.image}" class="img-responsive img-centered" alt="{$v.name}">
        </a>
    </div>
    <div class="item">
        <a href="#">
        <img src="{base_url()}assets/upload/brands/{$v.image}" class="img-responsive img-centered" alt="{$v.name}">
        </a>
    </div>
    <div class="item">
        <a href="#">
        <img src="{base_url()}assets/upload/brands/{$v.image}" class="img-responsive img-centered" alt="{$v.name}">
        </a>
    </div>
</div>

<script>
    $("#brand-slider").owlCarousel({
        rtl: true,
        loop: true,
        items: 6,
        pagination: false,
        autoPlay: true,
        responsive: true
    });
</script>

Answer 1

只需添加到你的 CSS 中

.owl-carousel{
 direction: ltr !important;
}

• 其他解决方案也可以，但当您向右或向左拖动时，轮播会跳跃

Answer 2

这个解决方案对我有用

添加方向：ltr; 转到owl.carousel.min.css文件中的.owl-stage-outer类，如下所示

.owl-stage-outer{
 position:relative;
 overflow:hidden;
 -webkit-transform:translate3d(0,0,0);
 direction: ltr;
}