如何使此滑块对手机响应答案

【问题标题】：how to make this slider responsive for mobiles如何使此滑块对手机响应
【发布时间】：2019-12-24 15:23:53
【问题描述】：

我设计了这个滑块，它运行良好，但没有响应，我无法在手机中正确使用它，任何人都可以帮助我让它响应。

在这里摆弄https://jsfiddle.net/iamrahulkumar001/m5yt0pjf/

我尝试过使用不同的滑块，但没有一个适合我我正在使用 bootstrap 4

https://jsfiddle.net/iamrahulkumar001/m5yt0pjf/我的滑块在这里工作

   <div class="brain_sliders row" style="position: relative;">
 <div id='brain_sliders' class="carousel slide" data-ride="carousel" data-pause="hover">
    <div class="carousel-inner">
        <div class="carousel-item active">
            <div class="row">
                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/super-30-10-07-2019-05-32-06-583.jpg" alt="1 slide"></div>

                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/midori-with-pianist-ieva-jokubaviciute-05-07-2019-12-08-11-888.jpg" alt="2 slide"></div>

                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/bade-miyan-deewane-10-07-2019-03-32-41-494.jpg" alt="3 slide"></div>
            </div>
        </div>
        <div class="carousel-item">
            <div class="row">
                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/mahabharata--the-epic-tale-10-07-2019-11-24-21-041.jpg" alt="4 slide"></div>
                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/midori-with-pianist-ieva-jokubaviciute-05-07-2019-12-08-11-888.jpg" alt="5 slide"></div>
                <div class="col-md-4 col-sm-12"><img class="d-block w-100" src="https://in.bmscdn.com/showcaseimage/eventimage/bade-miyan-deewane-10-07-2019-03-32-41-494.jpg" alt="6 slide"></div>
            </div>
        </div>
    </div>

    <a class="carousel-control-prev" href="#brain_sliders" role="button" data-slide="prev">
  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  <span class="sr-only">Geri</span>
</a>
<a class="carousel-control-next" href="#brain_sliders" role="button" data-slide="next">
  <span class="carousel-control-next-icon" aria-hidden="true"></span>
  <span class="sr-only">İleri</span>
</a>

</div>

【问题讨论】：

标签： responsive-design bootstrap-4 slider media-queries

【解决方案1】：

这不是完全正确的解决方案，但您可以创建两个滑块。一种用于分辨率小于 md (d-block d-md-none) 和您的 (d-none d-md-block)。

我只使用过一次这个解决方案，因为我正在解决同样的问题，需要尽快解决。

【讨论】：