Twitter bootstrap 多项目转盘的响应问题（已解决）

继上一个关于另一个旋转木马的主题之后，我更改了旋转木马

我从这里提供的一个代码片段中得到的新代码：，这是一个非常有响应性的代码，另一方面，当我将它应用到我的项目中时（我只能将它显示为“图像”，因为我只更改了图像路径）

但我的问题是，它只显示一个图像（在移动版是正常的），但在桌面版它不会放大

原始代码段PC版本：

原始代码段响应版本： （转到我提到的链接时设置动画）

我的智能手机版本carrousel： 用动画。 PC上的显示器：

---

它保持动画，房子不会根据屏幕大小放大。

基本上，它不支持桌面视图的缩放模式，在移动视图方法中，它的正常活动缩放方法是因为苹果设备。

<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img class="d-block w-100" src="..." alt="First slide">
    </div>
    <div class="carousel-item">
      <img class="d-block w-100" src="..." alt="Second slide">
    </div>
    <div class="carousel-item">
      <img class="d-block w-100" src="..." alt="Third slide">
    </div>
  </div>
  <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>

}

对于JS，我从以下位置获取代码：不修改它

Repply For bootsnip:

我补充说：

.carousel-item {margin-right: auto !important;}

---

它适用于我

我使用的是windows，我使用的代码片段除了我以外都可以正常工作，所以我只需更改图像路径，其他什么都不做。这我不明白。是的，有道理，如果是这样的话，它应该是最大的动画区域控制与缩放方法。所以你们可以用缩放的方法来访问。但我不是在找那个，我想要的是当我在pc上时，它显示所有的排列，当我在手机上时，它显示一个接一个。因此，当我在移动设备上时，它可以工作，但在桌面上，它将其保留在移动版本中，而不开发旋转木马。当然，它对移动桌面视图有响应。因为使用引导，所以它会随着像素的变化而变化。因此，旋转木马的编号会随着像素的变化而变化。我不明白原来的代码片段链接是如何工作的，而在我的家里，它也不会。从移动版本，它不会返回到桌面上所需的显示。桌面版已经不能工作了（不能按我的要求显示）。对不起，但这并不能改变任何事情，显示保持不变

@media (min-width: 768px) {

/* show 3 items */
.carousel-inner .active,
.carousel-inner .active + .carousel-item,
.carousel-inner .active + .carousel-item + .carousel-item,
.carousel-inner .active + .carousel-item + .carousel-item + .carousel-item  {
    display: block;
}

.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
}

.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
  position: relative;
  transform: translate3d(0, 0, 0);
}

.carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -25%;
    z-index: -1;
    display: block;
    visibility: visible;
}

/* left or forward direction */
.active.carousel-item-left + .carousel-item-next.carousel-item-left,
.carousel-item-next.carousel-item-left + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item,
.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
}

/* farthest right hidden item must be abso position for animations */
.carousel-inner .carousel-item-prev.carousel-item-right {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    visibility: visible;
}

/* right or prev direction */
.active.carousel-item-right + .carousel-item-prev.carousel-item-right,
.carousel-item-prev.carousel-item-right + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item,
.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
}

.carousel-item {margin-right: auto !important;}