Как перемещать 6 изображений одновременно с помощью вертикальной боковой панели навигации? ⇐ Html

[Anonymous]

Я пытаюсь создать галерею изображений с помощью Swiper.js. Вот чего я хочу:
1. В галерее отображается несколько изображений в сетке (например, 2 строки × 3 столбца, всего 6 изображений на слайде).
2. Когда я нажимаю кнопку «Далее» (расположенную на боковой панели справа), **6 изображений должны одновременно перемещаться** по горизонтали.
3. Изображения на каждом слайде должны оставаться выровненными по сетке и не разрываться по вертикали.
4. Я хочу создать макет, в котором кнопка «Далее» находится на боковой панели справа от галереи.
Я пробовал использовать классы «flex-wrap» и «col-*» внутри слайдов Swiper, но когда я нажимаю «Далее», изображения перемещаются вертикально или нарушают макет.
Как я могу сделать Swiper слайдом **6 изображений за раз**, сохраняя при этом их выравнивание в сетке и размещая навигацию справа боковая панель?





اخبار تصویری


\\
\\
\
\
\
\
\
\
\
\

\
\
\

\
\
\

\
\
\

\
\
\

\
\
\

\
\
\
\
\

\
\
\

\
\
\

\
\
\

\
\
\

\
\
\

\
\
\
\
\


Подробнее здесь: https://stackoverflow.com/questions/798 ... navigation