Свобода слова вебмастерского

Анимация элемента details на CSS (без использования JavaScript)

Dimox — Sat, 03 Jan 2026 08:19:44 +0000

CSS в последние годы очень активно развивается и постепенно добавляет решения, позволяющие сделать то, что раньше без JavaScript было нереально. Одна из таких возможностей - анимация ширины или высоты элемента из нуля в неопределенное значение типа auto, fit-content, max-content. У меня уже есть статья, в которой я рассказывал, как сделать анимацию тега

с использованием…

WordPress и Nuxt на одном домене

Dimox — Mon, 04 Nov 2024 05:55:48 +0000

В данной статье я расскажу, как подружить WordPress и Nuxt в пределах одного домена в случае, когда изначально в корне сайта был WordPress, и вы решили добавить к нему Nuxt.

Swiper на Vue.js с веб-компонентами

Dimox — Mon, 24 Jun 2024 14:41:18 +0000

Swiper - одна из лучших библиотек для создания слайдеров (более 39 тысяч звезд на GitHub не дадут соврать). Она имеет большое количество возможностей, настроек и постоянно развивается. Поэтому я давно использую её в своей работе. Поскольку в последнее время я активно верстаю на Vue.js (3-я версия с setup), то использовал соответствующие компоненты Swiper Vue. Начиная…

FAQ на тегах details и summary с анимацией и микроразметкой

Dimox — Thu, 19 Jan 2023 10:26:28 +0000

На сайтах часто встречаются блоки с ответами на часто задаваемые вопросы. Ответы при этом по умолчанию скрыты, а при клике на вопрос ответ раскрывается. Такого типа блок еще называют “аккордеоном”. Я видел разные варианты HTML-разметки “аккордеона”. Чаще всего, к сожалению, используется просто тег для всей структуры блока. Однако, с точки зрения семантики сюда прекрасно подходит…

Слайдер-превью изображений при наведении мыши

Dimox — Sun, 13 Dec 2020 06:12:52 +0000

На сайтах интернет-магазинов (или тому подобных), где на страницах рубрик представлены карточки товаров или услуг, можно встретить мини-слайдеры, в которых показаны превью этих товаров и услуг. При наведении курсора и перемещении его влево-вправо можно посмотреть несколько таких изображений. Чтобы было более понятно, о чем идет речь, зайдите на сайты ozon.ru и realty.yandex.ru (актуально на момент…