Text Morph — эффект "морфинга" текста с использованием фильтров SVG. Анимация реализована с помощью JavaScript.

#javascript #css

Color this sofa! – SVG + Blend Mode trick - реализация палитры цветов для изображений продуктов.

#css #javascript

CSS Egg Switch — переключатель с анимацией жареной яичницы, выполнен на чистом CSS.

#css

Glassmorphism Creative Cloud App Redesign — редизайн приложения Creative Cloud в стиле глассморфизма. Приложение адаптивное и реализовано с помощью jQuery.

#jquery

Sticky Photostack — при скролле страницы изображения собираются в одну стопку под разным углом. Эффект реализован на чистом CSS.

#css

Credit Card Payment Form — адаптивная форма заполнения данных карты, реализованная с помощью imask.js.

#imaskjs

Animated Tab Bar — стильная панель вкладок, анимация переходов реализована с помощью JavaScript.

#css #javascript

404 Page - адаптивная страница с ошибкой 404 с эффектом параллакса, реализованный с помощью библиотеки parallax.js и jQuery.

#jquery

🔔 Сайтодел — телеграм-сообщество веб-разработчиков:

Объяснения основ JavaScript, эффективные приемы в CSS, пошаговая реализация сайта на Tilda, адаптивные макеты в Figma и полезные репозитории с GitHub.

Лучший способ освоить веб-разработку в кратчайшие сроки — это подписка на @sitodel

Bongo Cat Codes #2 — весёлый котик пишет код. Анимация зацикливания реализована с помощью GSAP и DrawSVGPlugin.

#gsap #javascript

Text Grid with Mouse Interaction — причудливый эффект текстовой сетки с переменными CSS и взаимодействием с мышью на JavaScript.

#css #javascript

Longcat Range Sliders — необычная реализация range-слайдеров в виде котиков, выполненная с помощью CSS и JavaScript.

#css #javascript

Tilt to make room for menu — анимация наклона фонового изображения и появления меню при нажатии на кнопку. Анимация реализована на чистом CSS.

#css

Menu Effect — эффект появления фонового изображения при наведении на пункт меню. Реализован с помощью jQuery.

#jquery

Circular reveal animation — круговая анимация раскрытия меню, реализованная с помощью JavaScript и библиотеки circular-revealer@0.0.8.

#javascript

From button to dialog — появление диалогового окна при клике на кнопку, реализованное с помощью React.

#react

Space button — анимация отправки сообщения в космическом стиле при клике на кнопку. Реализована с помощью GSAP.

#gsap

FLIP CLOCK — перекидные часы. Отсчёт времени реализован с помощью jQuery.

#jquery

Stack game — игра "Стековая башня", реализованная с помощью библиотек Three.js и Cannon.js

#treejs #cannonjs

Hamburger Menu Animations — 4 вида плавной анимации для гамбургер-меню, реализованные на чистом CSS.

#css