Перейти к содержимому

Слайдер с 3D эффектом волны на чистом CSS

ВебКадеми | Юрий Ключевский

0:00 / 0:00

Слайдер с 3D эффектом волны на чистом CSS

3 250 просмотров · 2 г. назад
ВебКадеми | Юрий Ключевский
58 тыс. подписчиков
3 250 просмотров · 2 г. назад
Слайдер с 3D эффектом волны на чистом CSS. Реализация с помощью CSS трансформаций, работа с перспективой и z-осью в CSS. Слайдер без JavaScript. Раскрытие активного слайда по клику. Архив с кодом из урока в Telegram канале: https://t.me/+friZxyBulgNmYjE6 (пост за 05.06.24) Материалы ВебКадеми на всех площадках: https://webcademy.ru/taplink/ ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс "Создай свой первый сайт на HTML5 и CSS3" От установки редактора, до публикации в сети. 👉 Получить уроки, конспекты, макет и код из уроков: http://webcademy.ru/htmlsite/ :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Мои авторские курсы: 💻 Профессия HTML верстальщик Для начинающих. Курс по созданию и верстке сайтов. 👉 https://webcademy.ru/htmlstart/ 💻 Курс "Frontend разработчик. JavaScript + React" Станьте frontend разработчиком за 3 месяца. 👉 https://webcademy.ru/jscourse/ 💻 Курс "Разработка сайтов на PHP + MySQL" Сможете создавать сайты с любым функционалом. 👉 https://webcademy.ru/phpcourse/ 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе 💳 возможна рассрочка 💳 если курс не понравится, вернём деньги в первую неделю :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💈 Сайт ВебКадеми: https://webcademy.ru/ 💈 Группа Вконтакте: https://vk.com/webcademy 💈 Telegram канал: https://t.me/webcademynews ТАЙМ КОДЫ: 00:00 Демонстрация 00:30 Создание проекта 01:30 HTML разметка 03:25 CSS стили 08:57 Hover эффекты для изображений 14:05 Захват курсора слева и справа от слайда 17:05 Трансформация слайдов справа от активного 18:59 Трансформация слайдов слева от активного 20:34 Открытие слайда по клику