WD-css3-ui-20120117-nav-index

From W3C Wiki

This is an archive page for the 'nav-index' property. Spec source markup is included here (direct cut/paste) from the CSS3-UI editor's draft that was last published in http://www.w3.org/TR/2012/WD-css3-ui-20120117/

Spec Markup

from commented out "At risk due to only one implementation" section

<li>nav-index property
	implemented for sure only by Opera, http://www.opera.com/docs/specs/presto22/#css
	possibly obsolete: Tasman v1 internal implementation
	possibly current: MSTV Tasman
	required (depended on) by non-web DVB-HTML, ATSC standards
	 - unknown if any DVB-HTML or ATSC simulators
</li>

from 9.2.1. Sequential navigation order: the ‘nav-index’ property

<h4 id="nav-index">Sequential navigation order: the 'nav-index' property</h4>

The 'nav-index' property is an input-method-neutral way of specifying the sequential navigation order (also known as "tabbing order").
<table class="propdef">
<tr><th>Name:</th><td><dfn>nav-index</dfn></td></tr>
<tr><th>Value: </th><td>auto | <number> | inherit</td></tr>
<tr><th>Initial:</th><td>auto</td></tr>
<tr><th>Applies to:</th><td>all enabled elements</td></tr>
<tr><th>Inherited:</th><td>no</td></tr>
<tr><th>Percentages:</th><td>n/a</td></tr>
<tr><th>Media:</th><td>interactive</td></tr>
<tr><th>Computed value:</th><td>specified value.</td></tr>
<tr><th>Animatable:</th><td>as <a href="http://dev.w3.org/csswg/css3-transitions/#animtype-number">number</a></td></tr>
</table>
<dl>
<dt>auto</dt>
<dd>The element's sequential navigation order is assigned automatically by the user agent.</dd>
<dt><number></dt>
<dd>The number (which is non-zero and positive) indicates
the sequential navigation order for the element.
''1'' means first.
Elements with the same nav-index value are navigated
in document order when that nav-index value is being navigated.
</dd>
</dl>

This property is a replacement for the HTML4/XHTML1 attribute
'<a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">tabindex</a>' ([[HTML401]], section 17.11.1).
Borrowed and slightly rephrased from the HTML4 Recommendation:

This property specifies the position of the current element in the sequential navigation order for the current document.

The sequential navigation order defines the order
in which elements will receive focus when navigated by the user via the keyboard.
The sequential navigation order may include elements nested within other elements.

Elements that may receive focus should be navigated by user agents according to the following rules:
<ol>
<li>Those elements that support the nav-index property
and assign a positive value to it are navigated first.
Navigation proceeds from the element with the lowest nav-index value
to the element with the highest value.
Values need not be sequential nor must they begin with any particular value.
Elements that have identical nav-index values should be navigated in document order.
<li>Those elements that do not support the nav-index property
or support it and assign it a value of ''auto''
are navigated next.
These elements are navigated in document order.
<li>Elements that are disabled do not participate in the sequential navigation order.
</ol>

The actual key sequence that causes sequential navigation or element activation
depends on the configuration of the user agent
(e.g., the "tab" key is often used for sequential navigation,
and the "enter" key is used to activate a selected element).

User agents may also define key sequences to navigate the sequential navigation order in reverse.
When the end (or beginning) of the tabbing order is reached,
user agents may circle back to the beginning (or end).
The key combination "shift-tab" is often used for reverse sequential navigation.

Note: The 'nav-index' property is at risk.

from Appendix C. Default style sheet additions for HTML

<pre> *[tabindex] { nav-index:attr(tabindex,number) }

See Also