Dofactory.com
Dofactory.com
Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest freelancing marketplace for people like you.
By adding your name & email you agree to our terms, privacy and cookie policies.

HTML <area> tabindex Attribute

The tabindex attribute on an <area> tag specifies the tab order relative to the other areas and controls.

The tabindex value indicates when the area can be focused.

Example

#

Three <area> elements with tabindex values of 3, 2, and 1 respectively.
To see <area> focus, place focus on the mouse (in the below image) and then tab a couple times.

Computer Screen Keyboard Mouse
<img src="/img/html/computer-map.png" alt="Computer" usemap="#computermap">

<map name="computermap">
  <area tabindex="3" shape="rect" coords="253,142,16,2" alt="Screen" href="javascript:alert('Screen was clicked');">
  <area tabindex="2" shape="rect" coords="262,218,0,156" alt="Keyboard" href="javascript:alert('Keyboard was clicked');">
  <area tabindex="1" shape="circle" coords="267,234,22" alt="Mouse" href="javascript:alert('Mouse was clicked');">
</map>

Code explanation

The tabindex attribute assigns a tab sequence number to an area.

The actual tabindex numbers are not important; for example 30, 22, and 10 gives the same results as 3, 2, and 1.


Using tabindex

The tabindex specifies the focus order of the <area> relative to the other areas or controls on the page.

This attribute indicates the sequential order of elements using the keyboard's tab key.

With a negative tabindex value, the area is not reachable by tabbing but can be accessed by mouse or JavaScript.

The tabindex attribute is a global attribute that can be applies to any element.


Syntax

<a tabindex="index">

Values

#

Value Description
index Numeric value indicating the tab order relative to the other controls/areas.

Browser support

Here is when tabindex support started for each browser:

Chrome
15.0 Sep 2011
Firefox
4.0 Mar 2011
IE/Edge
7.0 Oct 2006
Opera
10.0 Aug 2009
Safari
5.1 Jul 2011

You may also like

 Back to <a>

Last updated on Sep 30, 2023

Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest freelancing marketplace for people like you.
By adding your name & email you agree to our terms, privacy and cookie policies.

Guides