Карточки в виде стикеров для заметок
Информационные карточки в виде стикеров со случайным углом наклона
Наклон карточек осуществляется случайным образом небольшим JS-кодом.
Простые решения по работе с вкладками, блоками и списками
Перейти в разделШаблоны сеток на CSS Grid
Резиновые квадраты на CSS
Тень для clip-path
Внутренний border-radius у блока
Блок из 4-х фотографий
Эффект радиоволны на кнопке или блоке
Предупредительные сообщения на CSS
Background для бордюров
Полупрозрачный бордюр на CSS
Зигзагообразный бордюр на CSS
Обновление фрейма по клику
Masonry сетка на CSS
SVG фильтры для создания эффекта дрожания
Длинная тень от блоков
Фильтрация и сортировка элементов
Фильтрация и сортировка элементов с библиотекой Isotope
В данной теме нет описания самой библиотеки Isotope, а лишь представлены несколько готовых примеров для фильтрации и сортировки элементов.
Градиенты для блоков
Градиенты для карточек, блоков или секций на чистом CSS
В теме представлено 20 различных вариантов и все они применяются к одному элементу.
Новогодняя открытка
Блок-секция с поздравительной открыткой к Новому Году.
Данный пример выполнен на CSS и коротким JS, который служит для смены класса.
Открытка открывается по клику и отлично выглядит на всех экранах.
Мобильный Tab Bar с вкладками
Мобильный Tab Bar с переключающимися вкладками
Tab Bar выполнен с применением библиотеки jQuery и может использоваться как каркас всего сайта или определенной его секции.
Блоки с разноцветными пузырями
Анимированные разноцветные пузыри вокруг информационных блоков на JS
Решение не использует дополнительных библиотек и хорошо подойдет для оформления блоков на сайтах детской тематики.
Адаптивные вкладки openTabby
jQuery плагин openTabby для создания адаптивных табов с разными настройками.
Несмотря на то, что данный плагин довольно старый (2015 года) и не имеет даже документации от разработчика, в нем есть ряд полезных возможностей.
Открытие и закрытие контента на jQuery
Кнопки "показать полностью" и "показать еще" для открытия и закрытия дополнительного контента
По своей сути "показать полностью" и "показать еще" это одно и тоже, но для каждого варианта в этой заметке используются разные решения.
В интернете масса различных примеров, как показать и скрыть контент, нажав на кнопку, но все они, как правило, реализованы для одного конкретного блока. В данной теме оба примера можно применять к неограниченному их числу.
Скрипты используемые в этих примерах сделаны для библиотеки jQuery
Поздравление с 8 марта
Блок с вращающимся цветком и поздравлением с 8 марта
Поздравление имеет мобильный вариант и занимает совсем немного места
