Карусель, при клике, замещается фото заднего плана на всем сайте, что за скрипт?

Question

[Антон Вебсайтовский]

На одном сайте увидел карусель во всю ширину сайта, при старте, сразу выбирается первый блок, при клике на какой-то другой блок, идет замещение картинки на всем сайте я про задний фон.

Что за скрипт такой?, кто подскажет?

Карусель можно посмотреть тут в действии
__https://specialscomedy.com/

Comments

[DIVSIDE]

Обычный JS, что значит Что за скрипт такой? ?

[DIVSIDE]

DIVSIDE, аааааа. Это ты тот который типо делает сайты на заказ, а сам всё по кд тут спрашивает. Вспомнил

[Антон Вебсайтовский]

DIVSIDE, Все делают сайты кому-то.

[Антон Вебсайтовский]

DIVSIDE, Да я вот думал как реализовать, вставить прокрутку какой-то слайдер карусели, но дописать скрипт, при выборе блока, чтобы фотография бралась допустим из data-img, путь к фото, чтоб там лежал, ну и вставлялась в html, чет типа того.

[DIVSIDE]

Антон Вебсайтовский, бред и только. Это обычные слайды с кастомными thumbsnails.

Все делают сайты кому-то.

Не все, и не все как ты. Один лишь вопрос этот дает понять что ты нубик)

Может стоит посмотреть код примера и понять что это swiper js?

[godsplane]

все ответчики выше не правы. где тут слайдер если тут нельзя слайдить. это просто табы

[Антон Вебсайтовский]

godsplane, Кстати, точно, а где такие табы карусели есть, я чет не встречал. Но есть и слайдера такие, где как бы есть миниатюры, и кликая, мы показываем миниатюру большой.
Это по типу как карточки товаров делают. Схема похожая.

[Антон Вебсайтовский]

DIVSIDE, Посмотрел я какие есть примеры у данного скрипта swiper js, подобного там нет.

[DIVSIDE]

Антон Вебсайтовский, а сам дописать не догадываешься как? у слайдера есть замечательная штука как slideTo(index)
И вот оно прекрасно работает https://gyazo.com/13ffdbbd2063ff3ed3ab289637973cd1

[DIVSIDE]

godsplane, табы проще всего реализовать как? Через слайдер. И слайдер там есть (инсайд: эффект fade)

[Антон Вебсайтовский]

DIVSIDE, да я уже залез, смотрю там разные модули есть и т.д, столько всего что жесть)

[DIVSIDE]

Антон Вебсайтовский, тебе уже сказали как самое просто: swiper с доп.кодом с кастомной пагинацией. В твоем примере свайпер используется только для превью, а сами табы сделаны отдельно. Я предложил сделать все с помощью свайпера ибо это очень легко и делается за буквально 20 строк кода (пример по моей ссылке именно столько и занял)

[Антон Вебсайтовский]

DIVSIDE, да я так и понял, что придется сращивать два в одном.

[Антон Вебсайтовский]

Можно сказать реализовал, еще делаю.
Пример: https://codepen.io/AXOT/pen/Rwzaqvw

Есть нюансы, пока не разобрался с ними.
Хотел сделать у миниатюрных блоков отступ слева и справа, делаю, слева добавился, справа нет.
Идет какой-то сдвиг вправо.

width: 100%;
  box-sizing: border-box;
  position: absolute;
  bottom: 30px;
  left: 30px;
  right: 30px;
  z-index: 10;
    overflow: hidden;
}

[Виталий Першин]

Антон Вебсайтовский, У тебя width: 100%; при этом left: 30px; right: 30px; поэтому и сдвиг

[Антон Вебсайтовский]

Виталий Першин, да, точно, тупанул )