Как сделать такой волновой слайдер?

Question

[Александр Рыбаков]

Референс — https://www.nightingale.world

Нужен вот такой слайдер, или хотя бы похожий с эфектом волны. Также будут табы, но работать будут при клике, а не при наведении.
Может найдете что-то похоже на кодпене, у меня, к сожалению, не получилось(
На сайте в скриптах нашел коммент, что сделано скорее всего с GSAP JS
Заранее спасибо

Answer 1

[hzzzzl]

посмотри на кодепене three.js carousel или как-нибудь так, это three.js

https://codepen.io/ashthornton/pen/KRQbMO

https://codepen.io/bradjdouglas/pen/eoYNaq (этот у меня почему-то работает только в инкогнито табе и все равно криво, но эффект уже похожий)
https://codepen.io/UIUXLab/pen/KYEJrx

Comments

[Александр Рыбаков]

От WWF видел
второй очень похож, работает конечно криво
Спасибо за рефы с кодпена, если никто больше не напишет, выберу решением :)
Спасибо большое

[Александр Рыбаков]

Кстати, работает он норм, только вот нет проверки на isAnimated. При нажатии на следующий или предыдущий раньше того, как отыграла полностью анимация все крашится, надо просто ретурн фолсить)

[hzzzzl]

Александр Рыбаков, в любом случае, это и разноцветные частицы на фоне это точно three.js, но больше помочь не могу, я совсем не умею в этот вот вебгл ваш ¯\_(ツ)_/¯

вот еще что-то похожее
https://codepen.io/kenjiSpecial/pen/BVxxJa/
https://tympanus.net/codrops/2018/04/10/webgl-dist... (view demo)

Answer 2

[karinasorokina]

Насколько я поняла, это - fullpage.js + svg анимации

Comments

[Александр Рыбаков]

Меня интересует слайдер, а не фулпейдж js

Answer 3

[Юрий Уваров]

На этом сайте используется GSAP 3.0.4
https://greensock.com/