Имитация нового шрифта заголовка вертикальным масштабированием через CSS-свойство transform: scaleY()
Простое решение, как получить заголовок, отличный от основного текста, не подключая дополнительных шрифтов и используя только шрифт сайта.
Для реализации применяется CSS-свойство transform: scaleY(), которое растягивает или сужает буквы, придавая шрифту новый вид.
Полный список всех иконок RPG Awesome с удобным поиском и экспортом
Иконки можно экспортировать
background-image: url("...");)<svg>...</svg>)Изменение любых элементов через CSS при основных событиях на странице
Решение на JavaScript, которое добавляет классы на <body> при основных событиях: DOM построен, страница загружена, скролл, клик, движение мыши, касание и бездействие. Дальше через CSS можно управлять любыми элементами сайта.
Анимированный песочный эффект для изображений с реакцией на движение мыши
Эффект превращает фотографию в сотни тысяч парящих песчинок, которые реагируют на движение курсора мыши. Частицы следуют за указателем, разлетаясь в стороны и возвращаясь обратно, создавая ощущение живого, дышащего изображения.
Красивый ползунок с анимированной лентой - Verly Range Slider
Небольшой скрипт Verly Range Slider, работающий поверх нативного <input type="range">.Для отрисовки ленты, которая следует за ползунком с инерцией и плавностью, используется физический движок Verlet.
Макет телефона с подстановкой любых картинок для демонстрации фото и скриншотов
Готовое CSS-решение создаёт реалистичный корпус смартфона с экраном, динамиком, кнопками и отражениями. Внутрь можно подставить любое фото — оно автоматически подстроится под размер дисплея.
Адаптивная таблица с drag-скроллом с использованием библиотеки jQuery
Реализация таблицы, которую удобно просматривать на любых устройствах. При переполнении контента по ширине включается плавный drag-скролл.
Интерактивная блок-секция с одноразовой анимацией выгорания изображения и текста
Эффект имитации выгорания изображения с наложенным текстом, реализованный с использованием Canvas и WebGL-шейдера.
Анимация запускается по клику или другому событию, например, когда секция попала в видимую область экрана.
Плавающая кнопка с раскрывающимися контактами и плавными анимациями
Простое и удобное решение для размещения контактов на сайте.в виде фиксированной кнопки, которая раскрывается в меню с контактами (телефон, Telegram, Max).
Особенности: плавные анимации, превращение иконки конверта в крестик, подсказки при наведении, адаптивность и закрытие по клику вне зоны или ESC.
