Таблица с горизонтальной прокруткой
Адаптивная таблица с drag-скроллом с использованием библиотеки jQuery
Реализация таблицы, которую удобно просматривать на любых устройствах. При переполнении контента по ширине включается плавный drag-скролл.
Простые решения по работе с вкладками, блоками и списками
- Случайный цвет текста и фона
- Заголовок, перекрывающий блок с рамкой
- Шаблоны сеток на CSS Grid
- Тень для clip-path
- Внутренний border-radius у блока
- Блок из 4-х фотографий
- Эффект радиоволны на кнопке или блоке
- Предупредительные сообщения на CSS
- Background для бордюров
- Зигзагообразный бордюр на CSS
- Обновление фрейма по клику
- Masonry сетка на CSS
- SVG фильтры для создания эффекта дрожания
- Длинная тень от блоков
Коллекция карточек и блоков
3D-параллакс эффект с карточками
Блок-секция для трех карточек с трехмерным параллакс эффектом
Красивый эффект трехмерной трансформации блока при движении курсора мыши.
Эффект выделения блока при наведении курсора
Плавный переход фона от блока к блоку при наведении на них курсора мыши
Фон, который перемещается от блока к блоку, имеет свой собственный элемент и соответственно оформление. Используемый для этого JS-код не требует дополнительных библиотек и относительно прост, что позволяет использовать это решение в различных вариантах оформления.
Падающий снег на CSS
Падающий снег для шапки, секций или фотографий
Простой способ наложения падающих снежинок на секции или фотографии всего одним элементом <div class="snowblock"></div>
Вертикальные вкладки
Адаптивные вертикальные вкладки на jQuery
Преимуществом данной реализации табов является их адаптивный вариант, при котором контент каждой вкладки расположен сразу за ее названием (по аналогии с аккордеоном).
Кроме этого, каждая вкладка в данном решении имеет одинаковый HTML-код, что упрощает интеграцию в любую CMS (не нужно проставлять различные ID, классы и другие атрибуты).
Подсветка блоков курсором мыши
Подсветка фона и рамок блоков при движении по ним курсора мыши.
Решение выполнено с использованием JS, который занимает всего несколько строчек, не требует дополнительных библиотек и применяется к блокам в любом количестве секций.
Капли воды на CSS
Капли воды для оформления фона блока или секции
Капли в нужном масштабе расставляются по блоку или секции абсолютным позиционированием.
Карточки в виде стикеров для заметок
Информационные карточки в виде стикеров со случайным углом наклона
Наклон карточек осуществляется случайным образом небольшим JS-кодом.
Фильтрация и сортировка элементов
Фильтрация и сортировка элементов с библиотекой Isotope
В данной теме нет описания самой библиотеки Isotope, а лишь представлены несколько готовых примеров для фильтрации и сортировки элементов.
