|
Slider/Carousel. Нужна помощь
Подскажите, пожалуйтса, библиотеку, с помощью которой можно решить данную задачу.
Есть блок с шириной в 600 пикселей. Нужно сделать 2 слайдера (carousel), один главный и второй как бы навигация по нему.
Вверху слайдер на 3 картинки, на всю ширину блока, по центру картинка в 50% блока и сбоку две картинки обрезаются до 25% от блока и затемняются (т.к. в цетре картинка 300 пикселей, по бокам 150)
Внизу слайдер по высоте где-то меньше раза в 3, по ширине такой же, картиинок уже не 3 штуки, а 5-6, желательно.
Теперь логика: нижний слайдер можно листать, главный слайдер не должен реагировать, но если нажать в нижнем на какой-то элемент, то он открывается (листается к нему) и на первом, и на втором слайдере (Картинки в обеих слайдерах одинаковые). Например нажал на маленькую картинку арбуза в маленьком нижнем слайдере, оно перелисталось к нему и паралельно в верхнем слайдере тоже пролисталось к этому арбузу.
Логика главного (верхнего) слайдера: листаешь гланый - листается
и гланвый и нижний, всё. Ну и так же стрелочки по бокам у верхнего и нижнего слайдера.
Вообщем вот вся задача. Извиняюсь за большое количество текста.
Решал её на разных библиотеках, везде приходилось сильно расширять её, а это большое количество лишнего кода, костылей и это не то что нужно для большого проекта.
Буду очень благоден, если посоветуете библиотеку или любое другое решение для этой задачи, которое без костылей и красиво всё это сможет сделать.
|
