http://pt.stackoverflow.com/a/26250/100
Bootstrap Carousel: 4 visible elements, only advance one at a time.
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="row">
<div class="carousel slide" id="myCarousel">
<div class="carousel-inner">
<div class="item active">
<div class="col-xs-3" style="padding-left: 11px;"> <a href="#" title="texto1"> <img
src="http://musiccaptains.com/zh/wp-content/uploads/2012/09/Account.png" class="center-block"
/>
</a>
<p class="lead text-center" style="padding-top: 20px;">texto 1</p>
</div>
</div>
<div class="item">
<div class="col-xs-3" style="padding-left: 11px;"> <a href="#" title="texto1"> <img
src="http://musiccaptains.com/zh/wp-content/uploads/2012/09/Account.png" class="center-block"
/>
</a>
<p class="lead text-center" style="padding-top: 20px;">texto 2</p>
</div>
</div>
<div class="item">
<div class="col-xs-3" style="padding-left: 11px;"> <a href="#" title="texto1"> <img
src="http://musiccaptains.com/zh/wp-content/uploads/2012/09/Account.png" class="center-block"
/>
</a>
<p class="lead text-center" style="padding-top: 20px;">texto 3</p>
</div>
</div>
<div class="item">
<div class="col-xs-3" style="padding-left: 11px;"> <a href="#" title="texto1"> <img
src="http://musiccaptains.com/zh/wp-content/uploads/2012/09/Account.png" class="center-block"
/>
</a>
<p class="lead text-center" style="padding-top: 20px;">texto 4</p>
</div>
</div>
<div class="item">
<div class="col-xs-3" style="padding-left: 11px;"> <a href="#" title="texto1">...
CSS
.carousel-inner .active.left {
left: -25%;
}
.carousel-inner .active.right {
left: 25%;
}
.carousel-inner .next {
left: 25%;
}
.carousel-inner .prev {
left: -25%;
}
JavaScript
$('#myCarousel').carousel({
interval: 10000
});
$('.carousel .item').each(function () {
var next = $(this).next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));
for (var i = 0; i < 6; i++) {
next = next.next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));
}
});