Lightbox2 + bxSlider = неправильное количество изображений

Привет, это скучная техническая запись, но в интернете я на тему ничего не нашел, может быть, кому-то попадется и пригодится.

Есть такой хороший лайтбокс, который называется, хм, Lightbox.
И есть такой хороший слайдер, который называется bxSlider (внезапно).

По отдельности их довольно просто установить и настроить, но если вложить первый во второй, начинаются удивительные вещи.
Например. Есть 21 картинка. Слайдер показывает блоки по 3 картинки за раз, всего 7. Картинки отсортированы по названию от 01.jpg к 21.jpg. Картинкам назначен лайтбоксовский атрибут с названием группы. И когда кликаешь на первую картинку, под нею говорится, что это картинка №24 из 27 О_о
Справляемся с эмоциями и начинаем копать. Перекликиваем все картинки по очереди — узнаем, что первые и последние, почему-то, продублировались. Лезем в php — естественно, никаких дублей нет. Лезем в Firebug, дублей в слайдере нет. Или есть?! А что это за блоки с класссами bx-clone перед и после нашего слайдера? Я таких не добавлял.

Это, собственно, и есть ответ: слайдер реализует бесконечную прокрутку достаточно просто — добавляет в начало и конец по одному фейковому блоку, копирующему, соответственно, первый и последний. А внутри — картинки. 21+3+3 = 27, и начало отсчета туда же.
Можно, конечно, поменять слайдер и ли переписать его, но фактически достаточно будет отключить в конфиге bxSlider опцию infiniteLoop. Можно еще включить hideControlOnEnd, тоже не помешает. Конечно, мы теряем приятную зацикленность, но если речь о живом проекте, то за выигранное время можно или подобрать новый слайдер, или таки допилить этот, или — что более вероятно — вскоре окажется, что петля не так уж сильно и нужна. К тому же, петлю можно включить в лайтбоксе в опции wrapAround.

Добавить комментарий

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.