1

我知道之前有人问过这个问题，但是那里的解决方案对我不起作用。

我的代码：

<div id="gallerycontainer">
<div class="carousel-inner" align="center" style="margin-top:10px;">

<div class="item active" style="border:5px solid black;"><!-- class of active since it's the first item -->
  <img src="bootstrap/img/slider5.jpg" height="400px"  alt="" />
  <div class="carousel-caption">
    <p>Caption text here</p>
  </div>
</div>
<div class="item" style="border:5px solid black;">
  <img src="http://placehold.it/1200x480" alt="" />
  <div class="carousel-caption">
    <p>Caption text here</p>
  </div>
</div>
<div class="item" style="border:5px solid black;">
  <img src="bootstrap/img/slider3.jpg" height="400px" width="960px" alt="" />
  <div class="carousel-caption">
    <p>Caption text here</p>
  </div>
</div>
<div class="item" style="border:5px solid black;">
  <img src="bootstrap/img/slider4.jpg" height="400px" width="960px" alt="" />
  <div class="carousel-caption">
    <p>Our bedrooms are spacious and extremely luxurious.</p>
  </div>
</div>

`

gallerycontainer是一个自行创建的 div，其中放置了我的轮播。

我已经通过使用以下方法在头部调用了该函数：

<script type="text/javascript">
$(document).ready(function(){
$('.carousel').carousel({interval: 2000});
});
</script>

我的问题是，只有在我至少单击下一个按钮一次后，自动幻灯片才会开始。我究竟做错了什么？

4

6 回答 6

4

Bootstrap V3 Carousel 将在页面加载时开始滑动轮播（​​RL）......

<script>
$(function(){
$('#myCarousel').carousel({interval: 3000});
});
</script>

要更改幻灯片和加载之间的时间间隔，请更改间隔数；）

也放在文档的头......

于 2013-11-29T05:40:28.420 回答
3

不需要 jQuery。
只需将 data-ride="carousel" 添加到适当的轮播 div 容器中。

<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="5000">

于 2014-04-06T15:56:35.187 回答
0

尝试为您的 Carousel 提供一个 id

试试这个

 $('#myCarousel').carousel({                // For Carousel Image Slider
    interval: 6000,
    cycle: true,
 }).trigger('slid');

myCarousel = 轮播ID

于 2013-08-21T13:45:33.833 回答
0 
<script type="text/javascript">
$(document).ready(function(){
$('.carousel-inner').carousel({interval: 2000});
});
</script>
于 2013-08-21T13:46:08.400 回答
0

这通常发生在轮播的默认行为是鼠标悬停时暂停。

要覆盖它，您可以在声明轮播时使用属性 data-pause="false"，例如：

<div id="carouselExample" class="carousel slide carousel-fade" data-pause="false">
于 2021-01-27T07:21:05.827 回答
-1

尝试将 JavaScript 文件放在页面末尾而不是部分之前。

参考：http: //twitterbootstrap.org/twitter-bootstrap-3-carousel-not-automatically-starting/

谢谢

于 2014-02-03T17:25:16.453 回答