Question

在这里找人帮忙。我的Bootstrap 3轮播和wordpress（在我当地）有一些非常奇怪的行为。我有四张图像幻灯片，所有四张图像都正确显示并正确滑动。但是，当我到达最后一张幻灯片并前进时，旋转木马不再循环回到第一张幻灯片，而是添加另一张没有内容的幻灯片，只有Prev和Next箭头。如果我此时前进，下一张幻灯片是一个单一的薄色块。此时，无论向前还是向后移动，我都无法回到实际幻灯片。我很茫然，准备好让我的电脑坏掉。这是我的代码：

<div class="col-md-8">
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
<li data-target="#carousel-example-generic" data-slide-to="3"></li>
</ol>

<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="http://localhost:8888/wordpress/wp-content/themes/RMTide/images/image1.jpg" alt="">
<div class="carousel-caption">
<h2>Boys swimming win division championship</h2>
<p>By the time the Division I championships started on the morning of February 1, the RM boys swim team...<a href="#">Read More...</a></p>
</div>
</div>
<div class="item">
<img src="http://localhost:8888/wordpress/wp-content/themes/RMTide/images/image2.jpg" alt="">
<div class="carousel-caption">
<h2>RM poms places on top</h2>
<p>One hour later in Rockville, the Rockets' poms team sat hand in hand and took a deep breath...<a href="#">Read More...</a></p>
</div>
</div>
<div class="item">
<img src="http://localhost:8888/wordpress/wp-content/themes/RMTide/images/image3.jpg" alt="">
<div class="carousel-caption">
<h2>O'Malley voices opposition to weed legalization</h2>
<p>The legalization of marijuana has become a point of interest...<a href="#">Read More...     </a></p>
</div>
</div>
<div class="item">
<img src="http://localhost:8888/wordpress/wp-content/themes/RMTide/images/image4.jpg" alt="">
<div class="carousel-caption">
<h2>Down to the Wire:</h2>
<p>Seven days until the state championship...<a href="#">Read More...</a></p>
</div>
</div>
</div>

<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>

这是我的剧本 $（ '转盘'）。旋转台（{ interval：false }）; 任何帮助都非常赞赏。

Answer 1

我遇到了同样的问题（本地和远程）。我正在使用 Roots主题，并基本上从 Bootstrap 网站示例中复制了 Carousel 来源。我发现WordPress在源代码中插入了开放式 P标签，所以我通过基于网络的 HTML 压缩器运行 Carousel HTML 代码（<强> minifier ）。重新粘贴回 WP ，它已修复。

Bootstrap轮播没有骑自行车回第一张幻灯片

1 个答案: