Жесты мыши в chrome. А что в других браузерах? Проблема использования мышиных жестов
Наверное, многие после того, как поработают с сенсорной панелью планшета или современного телефона, испытывают определенный дискомфорт при работе с обычной мышью на обычном компьютере. Однако мало кто использует, а многие так и совсем мало знают о мышиных жестах. Возможно, причина такого незнания в том, что мало какие программы умеют понимать жесты. Однако в Opera такой способ управления реализован как штатная операция еще в 5-й версии. А для браузеров Firefox и Google Chrome эту функцию можно добавить с помощью расширений.
Что такое жесты мышью?
Жесты мышью (англ. mouse gestures) - это способ управления в браузере (или программе) при помощи движений мыши. Эти движения и образуют команды. Вы как бы рисуете мышью знак, который и служит командой. Обычно это выглядит так: вы нажимаете и удерживаете правую кнопку мыши и чертите мышью нужную фигуру. Обычно это самые простые движения - слева направо или наоборот, сверху вниз и наоборот, и (чуть сложнее) вниз и вправо, ну и так далее. «Рисовать» команды может быть быстрее и проще, чем искать нужный пункт меню. Кроме того, такой способ облегчает работу для тех, кому затруднительно пользоваться клавиатурой.
Проблема использования мышиных жестов
Самая большая проблема с использованием жестов - отсутствие общих стандартов применения и отображения жестов. Каждая из программ делает это по-своему. Например, в Opera мышиные жесты — это встроенная функция, которую нужно только включить и использовать готовые жесты.
Мышиные жесты в Opera.
А теперь более подробно о том, как мышиные жесты можно использовать для наиболее часто выполняемых операций. Вот один пример: Нажмите и удерживайте клавишу Ctrl на вашей клавиатуре и прокрутка колёсика мыши позволит изменить масштаб страницы.
Навигационные мышиные жесты
Возврат на предыдущую страницу:
Удерживая нажатой правую кнопку, кликнуть левой кнопкой
Удерживая нажатой правую кнопку, передвинуть мышь влево
Переход на следующую страницу
Удерживая нажатой левую кнопку, кликнуть правой кнопкой
Удерживая нажатой правую кнопку, передвинуть мышь вправо
Переход в корневую папку
Удерживая нажатой правую кнопку, передвинуть мышь вверх затем влево
Переход
Удерживая нажатой правую кнопку, передвинуть мышь вправо затем вверх
Удерживая нажатой правую кнопку и Shift
, передвинуть мышь вправо
Возврат
Удерживая нажатой правую кнопку, передвинуть мышь влево затем вниз
Удерживая нажатой правую кнопку и Shift, передвинуть мышь влево
Переход на домашнюю страницу
Двойной клик левой кнопкой мыши на пустой странице
Обновить страницу
Удерживая нажатой правую кнопку, передвинуть мышь вверх затем вниз
Остановить загрузку страницы
Удерживая нажатой правую кнопку, передвинуть мышь вверх
Мышиные жесты управления страницами
Открыть новую страницу
Удерживая нажатой правую кнопку, передвинуть мышь вниз
Двойной клик левой кнопкой мыши в пустом окне или на панели страниц
Дублировать страницу
Удерживая нажатой правую кнопку, передвинуть мышь вниз затем вверх
Восстановить или развернуть страницу
Удерживая нажатой правую кнопку, передвинуть мышь вверх затем вправо
Свернуть страницу
Удерживая нажатой правую кнопку, передвинуть мышь вниз затем влево
Закрыть страницу
Удерживая нажатой правую кнопку, передвинуть мышь вниз затем вправо
Удерживая нажатой правую кнопку, передвинуть мышь вправо-влево-вправо
А что в других браузерах?
В других браузерах, как обычно, недостаток функциональности очень удобно добирать с помощью расширений. Знатоки рекомендуют для Mozilla Firefox использовать Firegestures . В настройках расширения можно назначить свои жесты, которые вам будут удобны. Причем здесь редактировать жесты, намного удобнее, чем в Opera или Chrome .
Например, можно сделать такие настройки:
- Жест вниз – Закрыть вкладку (это быстрее, чем найти крестик на вкладке, или нажать Ctrl+W);
- Жест вверх – Открыть исходник страницы (это быстрее, чем нажать Ctrl+U);
- Жест влево – Добавить в Закладки (это быстрее, чем нажать Ctrl+D);
- Жест вправо – Сохранить картинку (это быстрее, чем клик на картинке).
Для Google Chrome мышиные жесты также добавляются с помощью плагинов. Лучшим плагином многие называют Smooth Gestures , но его разработка на сегодняшний день завершена. Есть еще плагин Gestures for Chrome (TM).
Еще секреты мышки в браузерах
Не все знают, что у колёсика мышки есть одно интересное назначение. Это колесико можно использовать не только для скролинга страницы, но и как кнопку. Если кликнуть колесиком по ссылке на странице, то она откроется в новой вкладке, а вы при этом остаетесь в прежнем окне. Можно спокойно дочитать статью, пока страница открывается в новом окне. Есть еще несколько секретов, которые для многих давно уже не секреты, но для полноты обзора стоит все-таки рассказать и о них.
Отметить часть текста
Щелкните мышью в начале текста для выделения, а затем, удерживая кнопку Shift . Необходимое пространство выделится.
Браузер - переходы назад-вперед
Для того, чтобы попасть на следующую страницу, не надо щелкать по соответствующим кнопкам, расположенным на панели инструментов. Достаточно нажать Shift и покрутить колесико мыши.
Изменение масштаба
Выполнить его очень легко, покрутив скролл одновременно с зажатой кнопкой CTRL . Этот способ можно использовать в большинстве программ.
Двойной и тройной клик
Если один раз щелкнуть мышью по слову , то там установится курсор .
Если щелкнуть дважды , то будет выделено слово целиком .
Если кликнуть трижды (быстро), выделится предложение .
Быстрый клик 4 раза по клавише мыши приведет к выделению всего абзаца .
Перетаскивание правой кнопкой мыши
Чтобы переместить файл в Windows , обычно используется метод drag’n’drop - мы берем элемент, тащим его в нужно место и бросаем. Все то же самое можно сделать правой кнопкой мыши. В этом случае открывается контекстное меню, которое позволяет не только переместить, но и скопировать файл или создать ярлык в необходимом месте.
Как выбрать несколько фрагментов в тексте?Когда вы работаете с длинным текстом, но вам нужны только отдельные фрагменты, не обязательно проводить с ними манипуляции по отдельности. Зажмите CTRL и выделяйте нужные слова и абзацы, а затем одновременно скопируйте в нужное место.
Вертикальные блоки
Этот способ работает в программе Microsoft Word и еще в некоторых программах для работы с текстом. Имеется альтернативный способ выделения диапазонов. Суть его в том, что можно выделить не только горизонтальный блок текста, но и вертикальный. Чтобы получить вертикальный блок — производим выделение, удерживая клавишу ALT . Для чего это нужно? К примеру, чтобы иначе отформатировать первые буквы каждой строки.
В заключение
Разумеется, функций мыши намного больше, чем описано в этом посте. Если вам известны еще какие-нибудь секреты и секретики, напишите об этом в комментариях. Возможно, другим будет тоже интересно и полезно.
Наверное, у каждого так бывало: сперва ты не понимаешь, зачем эта штука нужна, а потом уже не представляешь без неё свою жизнь (учёбу, работу и прочее). Для меня одной из таких штук стало управление жестами мыши. Фанаты жестового управления используют более 20 различных комбинаций. Но даже 5–7 базовых жестов способны изменить подход к решению повседневных задач в браузере.
Google ChromeОдно из самых популярных расширений для работы с жестами в Google Chrome - crxMouse. Мы уже о нём нашим читателям. Обладая обширной функциональностью, crxMouse предлагает пользователю большой набор возможностей и настроек. Все действия с вкладками можно осуществлять при помощи жестов: закрыть, открыть, обновить, перейти на следующую/последнюю или предыдущую/первую, прокрутить в конец или начало, добавить в закладки, копировать адрес страницы… И это ещё не весь набор.
Имеются в crxMouse и средства для работы со ссылками и изображениями. Жестом можно открыть ссылку в новой вкладке, новом окне, новом приватном окне, скопировать текст или адрес. Для изображений имеются команды «Открыть на новой вкладке», «Сохранить», «Копировать URL», «Выделить для последующего копирования в буфер обмена».
Настройки для действий с изображениями
Не обязательно использовать предустановленные жесты. Любому действию можно назначить свою комбинацию движений мыши. Для продвинутых пользователей предлагаются рокет-жесты и возможность написания собственных скриптов. Функция синхронизации делает ваши настройки доступными на любом устройстве, а резервное копирование сохранит их при непредвиденных ситуациях. Среди недостатков следует отметить отсутствие русского языка и замедление работы при всех включённых функциях.
Это расширение похоже на crxMouse, но умеет не так много. Например, нет жестов для работы с изображениями. Зато есть жесты для ссылок и текста, резервное копирование настроек, возможность написания собственных скриптов. Расширение вполне подойдёт для тех, кому не обязательно манипулировать рисунками. К тому же оно быстро работает.
По этому жесту у нас будет открываться Лайфхакер
Русский язык в Gestures for Google Chrome также отсутствует, но затруднений в обращении с расширением это не вызывает.
Mozilla FirefoxСамое популярное и самое функциональное расширение жестового управления для Mozilla Firefox. Умеет всё, что нужно, и ещё немного. Любые операции с вкладками, жесты для текста, ссылок и изображений, жесты с использованием колёсика мыши, рокет-жесты - перечислять можно долго. Если же и этого вам будет мало, то на сайте разработчиков есть готовые скрипты на все случаи жизни. Расширение переведено на русский язык, что существенно облегчает настройку.
Недостаток один: для открытия произвольной ссылки приходится использовать скрипт. Для этого нужно нажать кнопку «Добавить схему» в настройках и скопировать в поле «Схема» следующий текст:
Const URL = "//сайт/"; const IN_NEW_TAB = true; const IN_BACKGROUND = false; if (IN_NEW_TAB) gBrowser.loadOneTab(URL, null, null, null, IN_BACKGROUND, false); else gBrowser.loadURI(URL);
Вместо //сайт/ вы вписываете нужный адрес, а в поле «Жест» указываете желаемую комбинацию движений мыши или просто рисуете жест в нижней части окна. Выглядит это, например, вот так.
Настройка открытия сайта Лайфхакер по жесту мыши в FireGestures
Mouse Gestures Suite
В качестве альтернативы FireGestures можно обратить внимание на расширение Mouse Gestures Suite. Оно является наследником известного в своё время All-in-One Gestures. Среди плюсов расширения - вполне достаточная функциональность (в том числе жесты для изображений и ссылок и жесты с использованием колеса мыши), быстрая работа, перевод на русский, резервное копирование настроек.
К сожалению, есть и недостатки. Некоторые пункты меню не переведены, настройки не разбиты на группы, и найти нужную получается не сразу. Существенный недочёт: нет возможности настроить открытие произвольного URL по жесту. Mouse Gestures Suite умеет открывать только две избранных закладки, но, чтобы воспользоваться даже этой функцией, придётся покопаться в свойствах закладок. В остальном вполне достойное решение.
Замечено: чем больше вы пользуетесь , тем меньшую пользу принесёт жестовое управление. Если же для работы в основном используете мышь, то вы просто обязаны освоить жесты. С ними ваш браузер уже никогда не станет прежним.
25 февраля 2008 в 19:46 Программируем жесты мышкой- JavaScript
Многие пользователи Opera и FireFox знают о существовании так называемых Mouse Gestures (для FF существует одноименный плагин) - жестов мышкой, на которые реагирует браузер выполняя различные действия (такие как открытия нового окна, закладки, назад, вперед и т.д. и т.п.), единственный недостаток данной фичи - нет взаимодеймствия с сайтом, и я решил написать небольшую бибилотечку, которая поможет разработчикам добавить подобный функционал на свой сайт…
На данный момент бибилотека понимает только 8 простеших жестов:
- Top - зажимаем кнопку мышки и ведем курсор вверх на 50-200 пикселей (по умолчанию) и отпускаем, смещение по оси X должно быть минимум в два раза меньше. чем по оси Y
- Bottom - ведем курсор вниз
- Right
- Top-Left - смещение по осям X и Y не должно различаться более чем в два раза
- Top-Right
- Bottom-Left
- Bottom-Right
Далее копируем следующий код:
// use jQuery for bind function to event
// set params
navigation.minX = 50;
navigation.minY = 50;
navigation.maxX = 300;
navigation.maxY = 300;
// callback functions
navigation.TopLeft = function (X,Y) { };
navigation.Top = function (X,Y) { };
navigation.TopRight = function (X,Y) { };
navigation.Left = function (X,Y) { };
navigation.Right = function (X,Y) { };
navigation.BottomLeft = function (X,Y) { };
navigation.Bottom = function (X,Y) { };
navigation.BottomRight = function (X,Y) { };
Это заготовка для наших «жестов», первые две строчки необходимы для того, чтобы повесить на глобальные события mousedown и mouseup наши две функции (используется бибилотека jQuery). Следующие 4 строчки указывают параметры жестов, т.е. лимиты в которых они будут срабатывать. Далее идет объявление 8 callback функций, в качестве параметров они принимают абсолютное смещение по оси X и Y.
Дабы исключить ложные срабатывания наших функций, лучше привязать их к нажатой клавиши «Ctrl» (код клавиши «Ctrl» равен 17, если хотите изменить - см. все коды на странице http://unixpapa.com/js/key.html):
$(window).keydown(function(event){switch (event.keyCode) {
case 17:
$(document).mousedown(navigation.mousedown);
$(document).mouseup(navigation.mouseup);
break;
}
});
switch (event.keyCode) {
case 17:
break;
}
});
А вот так выглядит код из моего примера :
function mouseGestures(){$(window).keydown(function(event){
switch (event.keyCode) {
//…
// different keys do different things
// Different browsers provide different codes
// see here for details: unixpapa.com/js/key.html
//…
case 17:
$(document).mousedown(navigation.mousedown);
$(document).mouseup(navigation.mouseup);
break;
}
});
$(window).keyup(function(event){
switch (event.keyCode) {
case 17:
$(document).unbind("mousedown");
$(document).unbind("mouseup");
break;
}
});
Navigation.maxX = 300;
navigation.maxY = 300;
navigation.TopLeft = function (X,Y) { select($("div#left div.top"),Math.abs(X-Y)) };
navigation.Top = function (X,Y) { select($("div#center div.top"),Y) };
navigation.TopRight = function (X,Y) { select($("div#right div.top"),Math.abs(X-Y)) };
navigation.Left = function (X,Y) { select($("div#left div.middle"),X) };
navigation.Right = function (X,Y) { select($("div#right div.middle"),X) };
navigation.BottomLeft = function (X,Y) { select($("div#left div.bottom"),Math.abs(X-Y)) };
navigation.Bottom = function (X,Y) { select($("div#center div.bottom"),Y) };
navigation.BottomRight = function (X,Y) { select($("div#right div.bottom"),Math.abs(X-Y)) };
}
function select(el,k) {
var speed = 1500;
switch (true) {
case (k