Pager bxslider?

Question

[fisherspoons]

Как можно поместить педжернатор (bxslider), тоже в слайдер, чтобы он пролистывался.В таком виде

Answer 1

[Иван Козлов]

bxslider.com/examples/thumbnail-pager-1
bxslider.com/examples/thumbnail-pager-2

Comments

[fisherspoons]

Внизу должен тоже быть по сути слайдер, в котором будем например отображаться 4 миниатюры

[Иван Козлов]

fisherspoons:
Выведи html 2х слайдеров.
У второго слайдера укажи у li атрибут(data-item="номер слайда").
запускай 2 слайдера с нужными параметрами.
var slider1 = $('.bxslider1').bxSlider(параметры большой слайдер);
var slider2 = $('.bxslider2').bxSlider(параметры для миниатюр);
Навешивай событие
$('.bxslider2 li').click(function(){
slider1.goToSlide($(this).data('item'));//это api bxslider
});

[fisherspoons]

Иван Козлов: да, я уже разобрался, вопрос если на странице есть табы а в них каждых есть такие слайдеры, короче слайдер работает только в первом открытом табе, походу загвоздка в одинаковых I'd , как быть с таким?

[Иван Козлов]

fisherspoons: использовать вместо id классы и вызывать через классы.

[fisherspoons]

Как вариант, но там JS переписывать так как все на id завязано

[Иван Козлов]

fisherspoons: либо попробовать при каждом переключении табов инициализировать слайдер.