Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Слайдер на всю ширину, центрирование текущего слайда, кастомный пейджинг (https://javascript.ru/forum/misc/58636-slajjder-na-vsyu-shirinu-centrirovanie-tekushhego-slajjda-kastomnyjj-pejjdzhing.html)

spo 01.10.2015 22:36

Слайдер на всю ширину, центрирование текущего слайда, кастомный пейджинг
 
Не так давно я интересовался о возможностях bxSlider для решения моей задачи.
Опробовав разные варианты я пришел к выводу что без хороших знаний js данный слайдер не удастся приспособить для ее решения.
По этому постараюсь максимально подробно и понятно описать то что требуется и прошу подсказать альтернативы в которых данный функционал будет заложен изначально.
  • Синий - ширина основного содержимого страницы
  • Желтый - текущий слайд
  • Зеленый - остальные слайды

Условия задачи:
  1. Текущий слайд всегда расположен по центру и имеет уникальный класс
  2. По бокам видны другие слайды, скрывающиеся за границами окна браузера (Изображения a-1, a-2, b-1, b-2).
  3. При увеличении ширины экрана слайды по бокам заполняют всю область до границ (Изображения a-1, a-2, b-1, b-2).
  4. В качестве компромисса слайды не заполняют всю область по ширине, а располагаются по обе стороны слева и справа равным количеством (Изображения a-3, b-3).
Так же необходима возможность использования кастомного пэйджинга.

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

a-1

a-2

a-3

b-1

b-2

b-3


Часовой пояс GMT +3, время: 21:57.