-
Notifications
You must be signed in to change notification settings - Fork 3
/
sample-3.02.html
54 lines (48 loc) · 1.87 KB
/
sample-3.02.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html>
<head>
<title>Web accessibility demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link type="image/ico" rel="shortcut icon" href="//resources.esri.com/favicon.ico">
<link type="image/ico" rel="icon" href="//resources.esri.com/favicon.ico">
</head>
<body class="claro">
<header>
<h1 tabindex="0">Web accessibility demo</h1>
<h2 tabindex="0">Capturing navigation in JavaScript</h2>
</header>
<main role="main">
<p tabindex="0">Web accessibility refers to the inclusive practice of removing barriers that prevent access to websites by people with disabilities. When sites are correctly designed, developed and edited, all users have equal access to information and functionality.</p>
<p tabindex="0">
The needs that Web accessibility aims to address include:
<ul>
<li>Visual</li>
<li>Motor/Mobility</li>
<li>Auditory</li>
<li>Seizures</li>
<li>Cognitive/Intellectual</li>
</ul>
</p>
<p style="font-style: italic" tabindex="0">Content from Wikipedia: <a href="http://en.wikipedia.org/wiki/Web_accessibility" target="_blank">Web accessibility</a><p>
</main>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("li")
.attr("tabindex", "0")
.on('keydown', function(e){
if( e.keyCode === 9 ) {
console.log("Pressing tab key on li number", $(this).index());
// true: authorize navigation to next element
// false: block navigation
return true;
}
});
});
</script>
</body>
</html>