在第一张图像上滑动时，Bootstrap轮播折叠

Question

嘿伙计们我试图搜索但找不到任何东西。我试图设置一个带有3个图像的twitter bootstrap轮播，一切正常，直到你尝试向左滑动时，你的图像1，似乎“活动”类消失了。要查看实时示例，请访问patfred.se转到产品组合并单击图像，您将看到轮播。

这是我的代码。

<div id="myCarousel" class="carousel slide">
   <!-- Carousel items -->
   <div class="carousel-inner">
   <div class="active item"><img src="<?php echo DIR_REL . $c->getAttribute('picture1'); ?>"> </img></div>
   <div class="item"><img src="<?php echo DIR_REL . $c->getAttribute('picture2'); ?>"> </img></div>
   <div class="item"><div class="item"><img src="<?php echo DIR_REL . $c->getAttribute('picture3'); ?>"> </img></div></div></div>
   <!-- Carousel nav -->
   <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
   <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>
<p class="portfolio-info"> <?php echo $c->getCollectionDescription(); ?></p>
<a href="<?php echo $c->getAttribute('out_link'); ?>" target="_blank">Gå till sidan</a>

Answer 1

标记中存在轻微错误。您需要做的就是删除.item div。

中的.item div

Answer 2

<img></img> 

这是错误的。图像标签不会以这种方式关闭。

<img src="" /> 

这是对的。

而且......正如agriboz所说，.item元素将重复每张幻灯片。

<!-- Carousel items -->
<div class="carousel-inner">
    <div class="active item">…</div>
    <div class="item">…</div>
    <div class="item">…</div>
</div>