Spatial Navigation

Introduction


Spatial navigation allow you to change the focus of a web page.  Traditionally, users had to either use a mouse or have to tab between different elements of a web page.  In many cases using a mouse isn't possible.  For example, there are many people that can not or do not use a mouse, and there are many devices ranging from cell phones to televisions that do not have a mouse.  This leaves the user having to tab through the element in whatever order the page is laid out in.  However, if the user just wanted to move the focus one element to the right or left, it might require dozens of key presses.

Example


Consider this following example.  The first time you load this page, if you press your tab key, the first link in the table below will be selected.  Assume that you wanted to select the link on the right side of this table.  Without Spatial Navigation, you would have to hit the tab key 30 times!  With Spatial Navigation, you can simply do one key combination and you simply move in the right direction.  These keys can be mapped to any values you like.  The default for FireFox is SHIFT-ALT ARROW.

Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Some link
Try to select me


How to build Spatial Navigation



When Spatial Navigation lands into CVS, you will simply add this following line to your mozconfig file:

ac_add_options --enable-extensions=spatialnavigation

Eventually, this may build as a default part of FireFox.

Modifying the behavior of Spatial Navigation



Spatial Navigation honor many different preferences that can disable, modify, or  improve its functionality. A complete listing of preferences that Spatial Navigation uses can be found here.

Alternatively, you can modify the focus look and feel by editing the focus style using CSS.  These are the same focus style rules that can be found on webpages.  Mozilla uses them to control the look and feel of all elements displayed .  A Sample of how to do this is can be found here.  Note that this approach is not compatible with the focus preferences mentioned above - it is either one or the other.