 | Клавиатурные сочетания на сайте (Accesskey или JavaScript) | |
Программирование | ||
На некоторых сайтах, в том числе на этом (GaGa.Su), используются специальные клавиатурные сочетания. Они помогают быстрее пользоваться сайтом реже пользуясь мышью. ... | ||
На некоторых сайтах, в том числе на этом (GaGa.Su), используются специальные клавиатурные сочетания. Они помогают быстрее пользоваться сайтом реже пользуясь мышью. Это работает как горячие клавиши, но для сайта.
Зачем это нужно?
Для удобства. Кому-то удобнее пользоваться мышью, а кому-то - клавиатурой. Было ли такое, что вы читаете статью или сборник анекдотов и вам нужно перейти на другую страницу, а тянуться за мышкой лень? Просто листать страницу можно клавишами "PageUp" (Вверх), "PafeDown"(Вниз). В некоторых браузерах можно использовать пробел. А как быть с другими страницами? Для этого и существует эта технология
Где это есть?
Вы можете оценить эти возможности "горячих клавиш" не покидая данного сайта. Вы можите воспользоваться Accesskey-сочетаниями, либо Alt+[KEY]; Ctrl+[KEY]; Ctrl+Alt+[KEY]
- f активирует строку поиска по сайту;
- g и/или u - главная страница сайта;
- j - Новости Одной Строкой;
- y - Новости;
- c - Статьи;
- d - Вакансии;
- v - Юмор;
- Left и/или b - На страницу назад (Только внутри рубрики "Юмор");
- Right и/или n - На страницу вперёд (Только внутри рубрики "Юмор");
- a - Форум;
Например: Ctrl+Alt+g - Откроет главную страницу на (GaGa.Su)
Обратите внимание, что в некоторых браузерах эти сочетания могут быть зарезервированны и могут выполнять другую функцию. Поэтому, могу рекомендовать использокание сочетаний Ctrl+Alt+[клавиша]
Немного теории
Есть две реализации этой для решения этой проблемы. Одна с помощью атрибута Accesskey, а вторая - через JavaScript.
Accesskey
Параметр accesskey позволяет активировать ссылку с помощью некоторого сочетания клавиш с заданной в коде ссылки буквой или цифрой. Браузеры при этом используют различные комбинации клавиш. Например, для accesskey="y" работают следующие сочетания.
- Internet Explorer: Alt + y
- Chrome: Alt + y
- Opera: Shift + Esc + y
- Safari: Alt + y
- Firefox: Shift + Alt + y
При этом, у Opera показываются все доступные варианты.
JavaScript
Тут и проще и сложнее одновременно. Проще - потому как можно назначить почти любое сочетание клавиш или, даже, на одиночную клавишу. (Но! Будьте осторожны! При использования одиночных клавиш - будет невозможно печатать - будут срабатывать горячие клавиши.) Тут есть подвох. Браузер не даст просто так использовать те сочетания, которые нужны ему самому. Так в Opera и FireFox, сочетание Ctrl+u отвечает за показ исходников и мешает использованию именно этого сочетания.
Практика
Accesskey
Тут всё просто:
<a accesskey="x" href="http://www.gaga.su">GaGa.Su</a>
, где x может быть цифрой (0-9) или латинской буквой (a-z). При нажатии магического сочетания +sx произойдёт автоматический переход по ссылке.
JavaScript
Тут используются коды клавиш. Узнать их можно с помощью следующего кода:
function checkKeycode(e) {
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
alert("keycode: " + keycode);
}
Как осуществить переход? Пусть будет ссылка вида:
Теперь можно приступить к написанию JavaScript обработчика событий - event.<a id="gaga_page" href="http://www.gaga.su">GaGa.Su</a>
function hotkeys(e) {
if (!e) e = window.event;
var k = e.keyCode;
if (e.ctrlKey) { // Сначала пусть будет нажат Ctrl
if (k == 71) { d = document.getElementById("gaga_page"); } // Ctrl+g
}
if (d) location.href = d.href;
}
Для того, чтобы всё это работало - необходим пусковой механизм.
function initial() {document.onkeydown = hotkeys;}И запуск по загрузке (с перестраховкой - иначе может не запуститься)
<body onload="initial()" onpageshow="if (event.persisted) {initial();}">20.11.2009
* При цитировании материалов, ссылка на источник обязательна.
