Question

我有一个有三个图像的旋转木马，滚动时会显示另一组三个图像。但图像没有响应。这是我的代码和截图。

＆＃13;

mergedArray = sourceArray.slice(0, index).concat(insertedArray, sourceArray.slice(index))

＆＃13;

enter image description here

Answer 1

为3个图像创建一个内部引导行，并为所有图像添加img-responsive类，并删除额外的填充和边距

   

 <div class="row">
        <div class="col-md-4">
        <img class="d-block img-fluid img-responsive" src="carouselbox.jpg" alt="First slide">
            <!-- Static Header -->
            <div class="header-text hidden-xs">
                <div class="col-md-12 text-center">
                    <h5>
                      <span><strong>Image1</strong></span><br /> Lorem Ipsum
                    </h5>
                 </div>
            </div>
            <!-- /header-text -->
    </div>

    <div class="col-md-4">
        <img class="d-block img-fluid img-responsive" src="carouselbox.jpg" alt="First slide">
            <!-- Static Header -->
            <div class="header-text2 hidden-xs" id="secondslide">
              <div class="col-md-12 text-center">
                <h5>
                  <span><strong>Image1</strong></span><br /> Lorem Ipsum
                </h5>
              </div>
            </div>
         <!-- /header-text -->
    </div>
    
    <div class="col-md-4">
     <img class="d-block img-fluid img-responsive" src="carouselbox.jpg" alt="First slide">
            <!-- Static Header -->
            <div class="header-text3 hidden-xs" id="secondslide">
              <div class="col-md-12 text-center">
                <h5>
                  <span><strong>Image1</strong></span><br /> Lorem Ipsum
                </h5>
              </div>
            </div>
            <!-- /header-text -->
    </div>

</div>

如何使旋转木马图像响应

1 个答案: