Архив категорий: Frontend

Главная  >>  Frontend

Иногда бывает надо обновить изображение в теге img при помощи jquery. В этой статье пример, как можно сделать refresh для img. Главное, что нужно знать — это то, что браузер кеширует изображения, что как раз и может мешать обновлению его на странице, если, к примеру, оно уже изменилось на сервере….

Нативный элемент загрузки файла в Html выглядит, мягко говоря, не очень хорошо — поэтому в этой короткой статье я приведу пример, как при помощи css стилизировать кнопку input type=file. Итак, решение включает две части — Html и CSS. Html. Оберните input в тег label: Также можно вынести элемент формы за…

В случае, когда видео, к примеру youtube, выводится в модальном окне или слайдере часта ситуация, когда пользователь скрыл окно, но при этом воспроизведение видео не остановилось и играет в фоне. Пример простого решения проблемы Вы найдете в этой статье. К примеру, у вас есть модальное окно с iframe, в котором…

Не будем говорить о том, как можно игнорировать нативный html-аттрибут — просто разберем пример, как решить проблему. Решение очень простое, но, тем не менее, не уменьшает удивление от поведения Safari. Данный простой код не даёт ввести в поле более, чем 4 символа. Ничего нового, впрочем. Удачи!

В некоторых ситуациях важно детально понять, какая клавиша была нажата в поле и соответственно отреагировать на ней. В короткой статье — таблица основных важных клавиш и их кодов для обработки. Сначала пример, как же собственно «ловить» нажатие: Как видите — в обработчик всегда приходит переменная с свойствами события. Для событий…

В случае, когда модальное окно обязательно к прочтению или в нем, например, форма «Я соглашаюсь» — нельзя чтобы клиент имел возможность закрыть его без согласия. А это сделать ему очень просто — просто нажав за его пределами. В этой статье маленький пример, как отключить эту возможность. Для решения задачи у…

Очень удобная для пользователя фишка — прокрутка страницы к первому полю с ошибкой в случае неуспешной валидации. В этой статье я напишу, как можно просто прокрутить страницу к первой ошибке после валидации yii2. Приведу пример с реального проекта: Все предельно просто. Если после валидации есть поле с классом .has-error —…

Плагин Autocomplete используется для быстрой подсказки пользователю вариантов ввода из определенного списка. Но в случае зависимости эти вариантов от других полей — обновление данных очень неочевидно. В этой статье — пример решения задачи. Самый простой пример — это зависимость условных моделей авто от марки. Когда пользователь выбрал Марку «Mercedes» —…

Задача программной прокрутки вниз может быть актуальна, например, при разработке чата. Блок сообщений всегда должен быть внизу, а последние сообщения всегда должны быть видны. Очень короткое решение — в этой статье. Пример для нативного Javascript: Пример для jQuery использует scrollTop: Оба эти примера позволят Вам программно прокрутить содержимое блока вниз….

jQuery позволяет очень просто отслеживать комбинации клавиш. В этой статье — пример, как отследить нажатие Ctrl+Enter .на jQuery. На самом деле всё очень просто. Нам нужно использовать событие keydown и event, который генериурет нам jQuery. Например, если нам нужно отследить нажатие Ctrl+Enter на всех textarea: Сначала мы подключаем наш обработчик…