Я хотел бы реализовать непрерывный горизонтальный скроллер, показывающий 6 из n миниатюр. это для магазина, для отображения логотипов производителей.JSSOR Непрерывный слайдер, отображающий 6 из n логотипов
я иду от: http://jsfiddle.net/b6qpdyex/3/
с этими настройками:
jQuery(document).ready(function ($) {
var options = {
$AutoPlay: true,
$PlayOrientation: 1,
$SlideEasing: $JssorEasing$.$EaseLinear,
$AutoPlayInterval: 0,
$SlideDuration: 5500,
$DisplayPieces: 6
};
var manufacturers_scroller = new $JssorSlider$("manufacturers_scroller", options);
});
это мой HTML/умником код
<div class="wrap" id="manufacturers_container">
<h2>Brauereien</h2>
<div id="manufacturers_scroller">
<div u="slides" class="scroll-slides">
{foreach item=manufacturer from=$manufacturers name=manufacturers_loop}
<div class="manufacturers_box" id="manufacturer{$manufacturer.manufacturers_id}">
<a href="/manufacturer.php?id={$manufacturer.manufacturers_id}">
<img src="/images/{$manufacturer.manufacturers_image}" title="{$manufacturer.manufacturers_name}" />
</a>
</div>
{/foreach}
</div>
</div>
</div>
и это соответствующий CSS
.manufacturers_box {
float: left;
text-align: center;
margin-bottom: 30px;
padding: 0 10px 10px 10px;
img {
width: 145px;
}
}
#manufacturers_scroller, .scroll-slides {
position: relative;
width: 980px;
height: 140px;
overflow: hidden;
}
Предварительный просмотр здесь: http://bierweltweit.kerndter.com/
прокрутки работает, и все в порядке, за исключением того, что «слайды» занимают всю ширину, поэтому одновременно отображается один логотип, я пробовал, но я не могу найти решение.
Спасибо за помощь!
С уважением, Крис