Блог

27 публикаций
Сначала популярное
Сначала свежее Сначала популярное Сначала обсуждаемое
Сбросить фильтры
Простое бургер-меню на чистом JavaScript

Простое бургер-меню на чистом JavaScript

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

Frontend
4 года назад
16 48k
Маска для ввода телефона на JavaScript

Маска для ввода телефона на JavaScript

Маска телефонного номера — это строка символов, которая используется для представления реального телефонного номера. Маска используется для того, чтобы облегчить пользователям ввод номера телефона в поле формы.
Frontend
4 года назад
4 21k
Создаем аккордеон на JavaScript

Создаем аккордеон на JavaScript

Всем привет! Мы продолжаем создавать элементы пользовательского интерфейса (UI). Сегодня коснемся такой темы, как аккордеоны. Аккордеон позволяет скрывать часть контента и при нажатии на бокс у нас плавно раскрывается весь контент.
Frontend
4 года назад
2 11k
Делаем кнопку наверх на JavaScript

Делаем кнопку наверх на JavaScript

При скролле страницы на сайте часто возникает потребность вернутся наверх. Например, в контентных сайтах при прочтении статьи необходимо вернуться обратно в меню.
Frontend
4 года назад
1 8,2k
UI-компоненты. Модальное окно на JavaScript

UI-компоненты. Модальное окно на JavaScript

Создадим простое модальное окно на JavaScript. Этот код создает модальное окно, которое появляется при нажатии кнопки «Открыть модальное окно». Модальное окно содержит некоторый текст и имеет кнопку закрытия (представленную символом «x») в правом верхнем углу.
Frontend
4 года назад
1 7,8k
Таймер обратного отсчета на JS

Таймер обратного отсчета на JS

Таймер обратного отсчета показывает сколько времени осталось до определенного события. Часто таймеры используют на сайтах, чтобы подтолкнуть пользователя к покупке: показывают сколько времени осталось до окончания акции.
Frontend
4 года назад
0 5,3k
UI-компоненты. Выпадающий список на JavaScript

UI-компоненты. Выпадающий список на JavaScript

Напишем выпадающее меню в JavaScript или его еще называют dropdown menu. Этот код устанавливает прослушиватель событий на кнопке раскрывающегося списка, которая переключает класс show в раскрывающемся меню.
Frontend
4 года назад
0 4,1k
Сортировка таблицы с помощью JavaScript

Сортировка таблицы с помощью JavaScript

Напишем сортируемую таблицу на JavaScript. Этот код добавляет прослушиватель событий к каждому элементу th, который сортирует массив строк на основе содержимого столбца, по которому щелкнули.
Frontend
4 года назад
0 3,9k
UI-компоненты. Кнопка с иконкой на CSS

UI-компоненты. Кнопка с иконкой на CSS

Создадим 5 красивых кнопок со значками на CSS, используя значки Font Awesome. В этом примере код HTML создает 5 кнопок с разными именами классов и включает значки Font Awesome внутри кнопок.
Frontend
4 года назад
0 3,0k
UI-компоненты. Поиск по списку на JavaScript

UI-компоненты. Поиск по списку на JavaScript

Напишем код на JavaScript для поиска по списку с комментариями. Этот код создает ввод для поиска и список элементов. Когда пользователь вводит поисковый запрос, скрипт просматривает каждый элемент в списке и сравнивает его с поисковым запросом.
Frontend
4 года назад
1 2,9k
Анимированные табы

Анимированные табы

В данном уроке мы создадим стильные табы на JS. Сделаем их на чистом JS и CSS, без использования библиотек. В процессе вы поймете как сделать табы, сможете стилизовать их под свои требования.
Frontend
4 года назад
0 2,6k
UI-компоненты. Переключатель на CSS

UI-компоненты. Переключатель на CSS

Переключатель (его еще называют тумблер) помогает выбрать два состояния. Например, включение или отключение темной темы на сайте. Чисто функционально переключатель - это тот же самый чекбокс.
Frontend
4 года назад
0 2,6k