2013-04-11 4 views
0

Я создаю сайт, на котором есть фотогалерею. Я использую colorbox для отображения изображений при нажатии. Однако, вместо того, чтобы иметь все эскизы на экране, мне было интересно, есть ли способ показать их в эффекте карусели.Thumbnail Carousel

Так, например, у меня есть 10 миниатюр, но я хочу разместить их в небольшой области, которая позволяла бы видеть только 3 одновременно. Я хочу, чтобы пользователь мог прокручивать назад и четверть через миниатюры, а затем использовать colorbox для просмотра выбранного изображения.

Я играл с различными вариантами, но все они отображают большее изображение над миниатюрой, а не всплывающее окно colorbox. Есть ли опция/модуль, который мог бы помочь, возможно, я пропустил?

Thanks

+0

Проверить этот URL http://www.motorcityindubai.com/imagegallery вы хотите такой же, как галерея, а затем следуйте по второй ссылке в Soni Kishan ответ. – Bala

ответ

0

У меня нет кода, чтобы дать вам в это время. Возможно, я мог бы что-то придумать через пару часов, но мне это не нужно. Я бы посмотрел на использование jQuery, чтобы это сделать. У вас может быть массив строк, представляющий пути к вашим изображениям ... затем вы можете использовать стиль 3 div для левого, правого и центрального значков стрелки на каждой стороне. Затем все, что вам нужно сделать, это установить источник фонового изображения на divs на 3 изображения в массиве, и каждый раз, когда вы нажимаете стрелку, вы перемещаете маркер через массив. Самый сложный случай заключается в достижении конца массива, когда вы нажимаете стрелку вправо и достигаете начало массива, когда вы нажимаете стрелку влево (обе простые проверки ...)

+0

Спасибо, я закончил тем, что принял ваш совет, используя flexslider в качестве базы и настройки для моих нужд. Цените, что вы указываете мне в этом направлении. – Darren

+0

Я никогда не слышал о flexslider. Я, вероятно, напишу что-то простое, чтобы опубликовать в своем новом блоге, чтобы помочь другим людям в вашей ситуации. –

Смежные вопросы