Популярное

1Вариант вертикального слайдера с превью на основе Swiper
2Установка GitHub Desktop и его базовое использование
3БЭМ - полный контроль над версткой
4Как сделать маску для текстовых полей input
5Как отследить клик вне элемента
Как отследить клик вне элемента

Как отследить клик вне элемента

Хорошая практика для удобства пользователя реализовать закрытие динамического элемента не только при клике на кнопку, а также при клике вне этого элемента

20/12/2020
Повышаем производительность при resize, scroll, ...

Повышаем производительность при resize, scroll, ...

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

14/12/2020
Адаптивная навигация

Адаптивная навигация

Навигация - одна из основных составляющих сайта. Она должна быть доступна и удобна для использования на любом устройстве.

09/12/2020
Основы адаптивной вёрстки

Основы адаптивной вёрстки

Рассмотрим основы адаптивной вёрстки, что такое область просмотра (viewport), как использовать @media запросы и некоторые не самые очевидные нюансы

02/12/2020
Плагин для отображения размеров окна браузера

Плагин для отображения размеров окна браузера

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

26/11/2020
Индикатор прокрутки на JavaScript

Индикатор прокрутки на JavaScript

С нуля напишем индикатор прокрутки страницы на чистом JavaScript.

23/11/2020
Скрываем/показываем Header при прокрутке

Скрываем/показываем Header при прокрутке

Как скрывать Header при прокрутке страницы вниз и отображать при прокрутке вверх

18/11/2020
Аккордеон меню на jQuery

Аккордеон меню на jQuery

Напишем простое и универсальное аккордеон меню на jQuery

10/11/2020
Подключаем веб-шрифты

Подключаем веб-шрифты

Как просто и корректно подключить веб-шрифты

09/11/2020
Stylus - препроцессор CSS

Stylus - препроцессор CSS

Знакомимся со Stylus - синтаксис и базовые возможности

04/11/2020
Pug - шаблонизатор и препроцессор HTML

Pug - шаблонизатор и препроцессор HTML

Знакомимся с Pug - синтаксис и базовые возможности

30/10/2020
Используем Gulp для ускорения процесса верстки

Используем Gulp для ускорения процесса верстки

Что такое Gulp? Как его установить? Как им пользоваться?

25/10/2020
Spotify - Ambulo

Spotify - Ambulo

Приятная музыка для верстки или просто по настроению

24/10/2020
Node.js - зачем верстальщику и как установить

Node.js - зачем верстальщику и как установить

Зачем HTML-верстальщику Node.js и рассмотрим установку по шагам

24/10/2020
Установка GitHub Desktop и его базовое использование

Установка GitHub Desktop и его базовое использование

Что такое Git, регистрируемся на GitHub, для чего нужен GitHub Desktop, установим и рассмотрим его базовое использование

21/10/2020
3D эффект карточек на CSS

3D эффект карточек на CSS

Практикуем БЭМ, CSS Transforms, CSS Grid, CSS переменные

15/10/2020
Выравнивание по низу карточки

Выравнивание по низу карточки

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

13/10/2020
БЭМ - полный контроль над версткой

БЭМ - полный контроль над версткой

Методология БЭМ позволяет более структурировано и гибко верстать независимыми Блоками и в дальнейшем наиболее комфортно поддерживать такую верстку

09/10/2020
CSS-переменные: как сделать темную тему

CSS-переменные: как сделать темную тему

Реализуем темную (и не только) тему с помощью css-переменных и немного JavaScript

29/09/2020
Эффект параллакса при прокрутке страницы

Эффект параллакса при прокрутке страницы

Интересный параллакс-эффект c помощью jQuery

28/09/2020
Анимация при прокрутке страницы

Анимация при прокрутке страницы

Анимируем элементы при прокрутке страницы

24/09/2020
Spotify - Limes

Spotify - Limes

Приятная музыка для верстки или просто по настроению

23/09/2020
Заливка текста градиентом или изображением

Заливка текста градиентом или изображением

Эффектный текст с фоновым градиентом или изображением

21/09/2020
Как закрепить блок при прокрутке страницы

Как закрепить блок при прокрутке страницы

Закрепляем блоки при прокрутке страницы в пределах родительского блока

17/09/2020