Качающиеся фоторамки на CSS
CSS-анимация с качающимися фоторамками
Анимация останавливается, когда курсор заходит на рамку.
Аккордеон на CSS
Вариант создания аккордеона на чистом CSS
2 примера создания аккордена без использования скриптов.
Один работает с использованием радиокнопок <input type="radio" /> , а другой с флажками <input type="checkbox" />
Радиокнопки — карточки
Оформление переключателей radio в виде карточек для тарифов или другой информации
Ранее уже был похожий пример в теме "Радиокнопки с иконками". Этот отличается немного другой реализацией, оформлением и предназначением.
3D слайдер-карусель
Адаптивный 3D слайдер-карусель с 3-мя видимыми фотографиями
Сладйер сделан на базе фреймворка Swiper
Двигающиеся по секции кольца
Фоновый эффект с двигающимися кольцами, соединенными линиями
Кольца разлетаются в разные стороны от курсора мыши
Бесконечный зум многоугольников
Фоновый эффект с бесконечным увеличением многоугольников
Эффект, реализующий данную анимацию, работает на библиотеке three.js
Новостной слайдер
Адаптивный слайдер новостных карточек или другой информации
Сладйер сделан на базе фреймворка Swiper
Карточки для заметок, комментариев или отзывов
Наложенные друг на друга карточки для заметок, комментариев или отзывов средствами CSS
Карточки увеличиваются и переходят на передний план при заходе на них курсора мыши, а на узких экранах располагаются без наложения.
Адаптивная сетка для новостных блоков
Адаптивная сетка с одинаковыми по высоте блоками для превью новостей или статей
Фотографии в блоках имеют одинаковый размер. По причине того, что обычно все добавляют разные по формату картинки — лишнее просто отрезается.
Кнопка "подробнее" всегда находится на одном уровне у всех блоков в строке
Решение основано на css-свойстве display: grid
