Статьи на тему «Frontend»

 

Иконка Рубрики
2 года назад

Форма обратной связи: отправка файла на почту

При создании форм обратной связи часто возникает потребность в отправке файла. Например, мы хотим отправить рисунок, для заказа печати плакатов в копицентре.
Frontend 3 670
2 года назад

Drag and Drop API. Подробное руководство на JavaScript

Если вы хотите получить подробную информацию о том, как использовать JavaScript для создания интерфейсов с drag and drop, вот несколько заметок, которые могут быть полезны.
Frontend 4 758
2 года назад

Как прижать футер к низу страницы с помощью flexbox

Вы пытаетесь прижать этот надоедливый футер к нижней части страницы? Не волнуйтесь! Это руководство покажет вам, как использовать flexbox, чтобы вернуть футер на свое место.
Frontend 3 555
2 года назад

Делаем увеличение картинки при наведении на CSS

Если вы ищете способ добавить интерактивности вашим изображениям, обратите внимание на css. С помощью всего нескольких строк кода вы можете добавить эффект «масштабирования» при наведении курсора на изображение.
Frontend 3 084
2 года назад

Создаем модальное окно для сайта

Модальное окно — это всплывающее окно, которое появляется поверх основного окна. Обычно оно используется для отображения дополнительной информации или для того, чтобы попросить пользователя подтвердить действие.
Frontend 3 715
2 года назад

Создаем слайдер карусель для сайта

Карусельный слайдер — это тип слайдера, который позволяет пользователям прокручивать серию изображений или другой контент. Карусельные слайдеры обычно имеют элементы управления навигацией со стрелками или точками, которые позволяют пользователю прокручивать содержимое.
Frontend 11 522
2 года назад

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

При скролле страницы на сайте часто возникает потребность вернутся наверх. Например, в контентных сайтах при прочтении статьи необходимо вернуться обратно в меню.
Frontend 6 469
2 года назад

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

Маска телефонного номера — это строка символов, которая используется для представления реального телефонного номера. Маска используется для того, чтобы облегчить пользователям ввод номера телефона в поле формы.
Frontend 17 280
2 года назад

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

В мире веб-дизайна постоянно появляются новые инструменты и технологии, которые помогают упорядочить процесс и сделать его более эффективным. Это особенно верно, когда речь идет о верстке веб-сайта.
Frontend 818
2 года назад

Верстка сайтов для начинающих

При создании веб-сайта одним из наиболее важных аспектов является макет. Макет — это то, как организован ваш сайт и как посетители будут перемещаться по нему.
Frontend 707
2 года назад

Верстка форм авторизации и регистрации по макету Figma

Рассмотрим, как сверстать две формы: одну для авторизации, вторую для регистрации пользователя. Данные формы вы можете адаптировать под себя: дизайн у них довольно простой, так же как сам код.
Frontend 6 511
2 года назад

Пишем темную тему для сайта

В этом уроке мы напишем скрипт на JS для переключения на темную и светлую тему. Мы будем использовать localStorage для сохранения данных о текущей темы, чтобы при перезагрузке страницы и выходе из браузера наша тема не «слетала».
Frontend 1 610
2 года назад

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

В данном уроке мы создадим стильные табы на JS. Сделаем их на чистом JS и CSS, без использования библиотек. В процессе вы поймете как сделать табы, сможете стилизовать их под свои требования.
Frontend 1 729
2 года назад

Адаптивная галерея для сайта

Рассмотрим создание полноразмерной галереи для сайта. В первой части напишем адаптивную сетку на CSS и выведем все фотографии в виде плитки.
Frontend 3 952
2 года назад

Руководство для начинающих по Sass

В этой статье вы узнаете основы препроцессора SASS/SCSS, что это такое и как использовать его возможности для быстрого написания стилей. Предполагается, что вы уже знакомы с основами HTML, CSS.
Frontend 13 408
3 года назад

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

Всем привет! Мы продолжаем создавать элементы пользовательского интерфейса (UI). Сегодня коснемся такой темы, как аккордеоны. Аккордеон позволяет скрывать часть контента и при нажатии на бокс у нас плавно раскрывается весь контент.
Frontend 7 992
3 года назад

Текст поверх картинки на CSS

В этой статье расскажу, как наложить и выровнять текст поверх картинки методом CSS. Часто возникает такая необходимость при разработке сайтов. Текст будем выравнивать по центру.
Frontend 2 551
3 года назад

Неоновая кнопка на чистом CSS

Неоновые кнопки добавляют приятный футуристический любому веб-сайту. Мне всегда нравилась магия неоновых вывесок, и я хотел воссоздать их с помощью CSS.
Frontend 4 442
3 года назад

Фиксированное боковое меню на чистом CSS

В этой статье создадим простое боковое меню с логотипом. Каждый элемент меню имеет свою иконку. При наведении элемент меню выделяется. Делать боковое меню будет на чистом CSS.
Frontend 6 764
3 года назад

Форма обратной связи: отправка формы на почту без перезагрузки

В заключительной статье мы сделаем отправку формы на почту. Важно, что отправляться данная форма будет без перезагрузки страницы (асинхронно). После отправки формы пользователь получит уведомление, что данные отправлены, либо сообщение со статусом ошибки.
Frontend 15 399