горизонтальная автопрокрутка в блоке

Ответить
Аватара пользователя
a.3

горизонтальная автопрокрутка в блоке

Сообщение a.3 »

Помогите найти быстрое решение на js следующей задачи. Есть такая картина:





Код:

Код: Выделить всё

HTML:
<div id="container">
   <div class="slide">...</div>
   <div class="slide">...</div>
   <div class="slide">...</div>
</div>
CSS:
#container {white-space: nowrap; overflow: auto;}
.slide {display: inline-block;}

Есть блок-контейнер, очень желательно резиновый 100% ширины, который содержит много inline-block-элементов разной ширины. Т.к. есть запрет переноса, соответственно появляется горизонтальный скроллбар при переполнении. Нужен js скрипт, который автоматически крутит содержимое контейнера направо-налево, и останавливается при наведении мышки. В интернете куча скроллеров/слайдеров, но я в этом разнообразии потерялся...

CSS указанный вовсе необязателен, да и без скроллбара можно обойтись, главное - плавный атоматический скроллинг туда-сюда (еще лучше - непрерывный, в одну сторону) ряда элементов произвольной ширины в контейнерном блоке тоже произвольной ширины. Многие mootools и jquery слайдеры требуют как для прокручиваемых элементов, так и для контейнера указание фиксированной ширины, а мне этого не надо... Поэтому, думаю, лучше реализовать именно через доработку обычного скроллинга, но, учитывая, что сам скроллбар, дабы не резать глаз, у меня стилизуется скриптом flexscroll.



Если еще короче - нужна плавная карусель разношироких элементов с остановкой анимации при наведении мыши.



Заранее спасибо.
Ответить

Вернуться в «Вебмастеру»