Question

当我使用正常的bootrap css加载滑块时，它可以正常工作：

<link rel="stylesheet" href="css/bootstrap.min.css">

但是当我用rtl css文件加载它时 - 照片正在改变，但幻灯片动画由于某种原因无法正常工作

<link rel="stylesheet" href="css/bootstrap-rtl.min.css">

我正在使用原始bootstrap repo中的RTL文件。

我的滑块：

    <!-- My Carousel     -->   
     <div id="carousel-example" class="carousel slide">

            <!-- Indicators -->
          <ol class="carousel-indicators">
            <li data-target="#carousel-example" data-slide-to="0" class="active"></li>
            <li data-target="#carousel-example" data-slide-to="1"></li>
            <li data-target="#carousel-example" data-slide-to="2"></li>
          </ol>

            <!-- Wrapper for slides -->
          <div class="carousel-inner">

                    <div class="item active">
                              <img src="gallery/img1.jpg" alt="IMG1">
                              <div class="carousel-caption" >  סלייד ראשון .   <button  type="button" class="btn btn-primary  btn-sm ">לפרטים</button>  </div>

                    </div>

                    <div class="item ">
                              <img src="gallery/img2.jpg" alt="IMG2">
                              <div class="carousel-caption">  סלייד שני .   </div>
                    </div>

                    <div class="item ">
                            <img src="gallery/img3.jpg" alt="IMG3">
                           <div class="carousel-caption">  סלייד שלישי ואחרון .   </div>
                  </div>

          </div>

     </div><!-- End of My Carousel     -->

Answer 1

您需要做的就是编辑轮播容器方向

<style>
#carousel_container, #or_beyond_the_container_if_needed {
direction: ltr;
}
</style>

这会改变旋转木马的方向

注释：此解决方案适用于任何轮播或滑块

Slider无法使用Bootstrap-RTL

1 个答案: