Jquery 无限旋转木马与推特引导
我有一个旋转木马,我正在使用推特引导 我必须在里面装5件东西。我将举一个简单的例子:Jquery 无限旋转木马与推特引导,jquery,css,twitter-bootstrap,Jquery,Css,Twitter Bootstrap,我有一个旋转木马,我正在使用推特引导 我必须在里面装5件东西。我将举一个简单的例子: <div id="carolsel" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="item active"> <div class="col-lg-3">
<div id="carolsel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="item active">
<div class="col-lg-3">
<p>Content</p>
</div>
<div class="col-lg-3">
<p>Content</p>
</div>
<div class="col-lg-3">
<p>Content</p>
</div>
<div class="col-lg-3">
<p>Content</p>
</div>
</div>
<div class="item">
<div class="col-lg-3">
<p>Content</p>
</div>
</div>
</div>
</div>
内容
内容
内容
内容
内容
它显示4个项目,然后单独显示一个项目。
有一种方法可以制作一个无限旋转木马,这样第一个内容就出现在最后一个内容之后
项
div由和foreach动态创建,内容来自MYSQL数据库。Bootstrap 3 carousel的默认行为是以无限的方式在项之间循环。请参阅Bootstrap 3文档中的第一个转盘示例:
从carousel的文档中,在选项部分,控制循环行为的设置命名为wrap,默认值设置为true,以便连续循环
在下面的示例HTML(来自文档)中,请注意,每个内容(图像等)将放在自己的div容器中:
<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>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="..." alt="...">
<div class="carousel-caption">
...
</div>
</div>
<div class="item">
<img src="..." alt="...">
<div class="carousel-caption">
...
</div>
</div>
...
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
...
...
...
这样做的可能重复,我必须将每个内容放在项中
div?是的,并编辑原始答案以反映说明这一点的HTML示例。是的,它起了作用。但我想显示4个内容,然后在显示1个最后内容和4个首字母中的前3个其他内容之后。我不确定我是否遵循了您的意图。在同一容器中显示1、2、3、4、5,然后显示1+2+3?是的。1234-幻灯片-5123-幻灯片-4512-幻灯片-34451继续。