В данной статье рассмотрим, как получить информацию о нажатой клавише клавиатуры или кнопки мыши, а также как выполнять необходимые действия (нужный код) при нажатии определенных сочетаний клавиш или кнопок (правый/левый клик мыши). Чтобы получить информацию, о том какая кнопка клавиатуры нажимается в данный момент, воспользуемся следующим кодом: function...
Рассмотрим, как обрезать текст с помощью CSS. Сначала обрежем строку с текстом и добавим многоточие, а затем рассмотрим как обрезать текст по высоте (многострочный текст) Обрежем текст, если он не помещается в строке. .crop-line { white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; } Обрезать текст по высоте (многострочный текст)...
В данном руководстве рассмотрим работу с API Метрики от Яндекса. Создадим счётчик просмотров страниц (статей). Первое и самое важное, без чего невозможно продолжать - у вас должен быть подключен счётчик Яндекс.Метрики. Далее порядок действий следующий: получить OAuth-токен; сформировать запрос для получения данных; организовать сохранение полученных данных на вашем...
Добавление CSS стилей на родительской странице не работает для тегов iFrame. Из данного руководства вы узнаете, как с помощью JavaScript изменить CSS стили в iFrame, а также как добавить новые (подключить с помощью link). Пусть у нас есть iFrame с id='iframeName' <iframe id="iframeName" src="./iframe.html"></iframe> Чтобы добавить новые стили...
Рассмотрим, как отловить клик вне элемента с помощью jQuery, а затем на чистом JavaScript. Это может понадобится, например, для всплывающих окон или для закрытия меню при клике за его пределами. Клик вне элемента jQuery Рассмотрим, как отловить клик за пределами блока Пример: имеем блок, пусть это будет всплывающее...
Переходим от библиотеки jQuery на чистый JavaScript. В статье вы найдёте следующие JavaScript методы: выбор элементов, перемещение по DOM-дереву, работа с атрибутами, событиями, классами; создание и удаление элементов, а также многое другое. Воспользуйтесь поиском ниже. Выбор элементов jQuery $(el); JavaScript document.querySelector(el); document.querySelectorAll(el); jQuery Выбор элемента по id $('#id');...
Рассмотрим, два стандарта микроразметки сайта: Schema.org и Open Graph на примере меню, хлебных крошек, сайдбара, картинок, подвала сайта и многое другое. Микроразметка необходима для лучшего понимания роботами структуры сайта. Это в свою очередь позволяет поисковым системам формировать более привлекательный и содержательный сниппет (краткое описание в поисковой выдаче). С...
Fetch API - это современный подход для создания асинхронных запросов. Рассмотрим, как отправить данные формы на сервер, используя Fetch API. Научимся отправлять файл вложением (прикреплять к письму файл) вместе с другими полями формы. 1. Что такое fetch(). 2. Отправка формы с помощью Fetch API. 2.1 Fetch API FormData....
Рассмотрим, как реализовать кнопку AJAX загрузки постов в WordPress. Т.е. загрузка постов будет осуществляться при нажатии на кнопку "загрузить еще" без перезагрузки страницы. Примерный код для страницы шаблона вывода постов. <?php $mypost_Query = new WP_Query( array( 'post_type' => '{тип_записи}', # post, page, custom_post_type 'post_status' => 'publish', # статус...
Рассмотрим, как можно реализовать плавное появление блока при наведении с помощью CSS Пример HTML структуры. Два блока: первый видимый, при наведении на который будем плавно показывать второй (скрытый) элемент. <div class="o2t-element">i</div> <div class="o2t-element--hidden">Скрытый элемент</div> Всплывающий блок может содержать абсолютно любой контент: текст, картинку, видео и т.п. Магия CSS...
Подборка лучших плагинов для WordPress 2021 года. Рекомендую обратить внимание всем разработчикам, а также владельцам сайтов, данные плагины значительно упростят и ускорят как разработку так и ведение сайтов на WordPress. Cyr-To-Lat - автоматическая транслитерация URL (RU в EN) Опции и произвольные поля Redux — Gutenberg Blocks Library &...