空間ナビゲーション

空間ナビゲーションとは、レンダリングされたページ上の要素を html の構造に関わらず、表示された位置関係によって上下左右にフォーカスを移動出来るキーボードナビゲーションのこと。

デフォルトのキー設定

Shift + 上下左右

フォーカス可能な要素を上下左右に移動する。

Ctrl + 上下

アンカー要素を上下に移動する。

関連アクション

• Navigate left
• Navigte Right
• Navigate Up
• Navigate Down

開発者向け

CSS

• nav-up/nav-right/nav-down/nav-left で移動先のヒントを示すことが出来る。
• 枠は :focus/:-o-prefocus 疑似クラスにおいて outline で定義されているので、それを上書きすると消したり表示を変更出来る。
• outline:-o-highlight-border や background-image:-o-skin("Active element inside") とすると空間ナビゲーションのような表示を実現出来る。
  • サンプル: Opera最強伝説！

JavaScript

• document.moveFocusUp/moveFocusRight/moveFocusDown/moveFocusLeft という関数でスクリプトから空間ナビゲーションの状態を制御出来る。

関連リンク

• Opera: Tutorial - Use Opera without a mouse