From: Patrick H. Lauke <redux@splintered.co.uk>
Date: Sat, 12 Jan 2013 17:04:51 +0000 (+0000)
Subject: Keyboard accessibility in documentation
X-Git-Tag: v3.0.0-rc1~697^2~2^2~3
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=a809daf2841f65ffac5030b2c6ce6aea60dd6233;p=thirdparty%2Fbootstrap.git

Keyboard accessibility in documentation

Removed unnecessary (?) and harmful (from a keyboard access point of
view) tabindex=-1 in the documentation examples.
---

diff --git a/docs/components.html b/docs/components.html
index 10ffd2e0c7..3c69c002b5 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -118,21 +118,21 @@
           <div class="bs-docs-example">
             <div class="dropdown clearfix">
               <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px; *width: 180px;">
-                <li><a tabindex="-1" href="#">Action</a></li>
-                <li><a tabindex="-1" href="#">Another action</a></li>
-                <li><a tabindex="-1" href="#">Something else here</a></li>
+                <li><a href="#">Action</a></li>
+                <li><a href="#">Another action</a></li>
+                <li><a href="#">Something else here</a></li>
                 <li class="divider"></li>
-                <li><a tabindex="-1" href="#">Separated link</a></li>
+                <li><a href="#">Separated link</a></li>
               </ul>
             </div>
           </div>
 <pre class="prettyprint linenums">
 &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu"&gt;
-  &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
   &lt;li class="divider"&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
 &lt;/ul&gt;
 </pre>
 
@@ -143,11 +143,11 @@
 &lt;div class="dropdown"&gt;
   &lt;!-- Link or button to toggle dropdown --&gt;
   &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
-    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Another action&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Something else here&lt;/a&gt;&lt;/li&gt;
     &lt;li class="divider"&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a tabindex="-1" href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Separated link&lt;/a&gt;&lt;/li&gt;
   &lt;/ul&gt;
 &lt;/div&gt;
 </pre>
@@ -171,18 +171,18 @@
               <p class="muted">Default</p>
               <div class="dropdown clearfix">
                 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
-                  <li><a tabindex="-1" href="#">Action</a></li>
-                  <li><a tabindex="-1" href="#">Another action</a></li>
-                  <li><a tabindex="-1" href="#">Something else here</a></li>
+                  <li><a href="#">Action</a></li>
+                  <li><a href="#">Another action</a></li>
+                  <li><a href="#">Something else here</a></li>
                   <li class="divider"></li>
                   <li class="dropdown-submenu">
-                    <a tabindex="-1" href="#">More options</a>
+                    <a href="#">More options</a>
                     <ul class="dropdown-menu">
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
                     </ul>
                   </li>
                 </ul>
@@ -193,18 +193,18 @@
               <p class="muted">Dropup</p>
               <div class="dropup">
                 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
-                  <li><a tabindex="-1" href="#">Action</a></li>
-                  <li><a tabindex="-1" href="#">Another action</a></li>
-                  <li><a tabindex="-1" href="#">Something else here</a></li>
+                  <li><a href="#">Action</a></li>
+                  <li><a href="#">Another action</a></li>
+                  <li><a href="#">Something else here</a></li>
                   <li class="divider"></li>
                   <li class="dropdown-submenu">
-                    <a tabindex="-1" href="#">More options</a>
+                    <a href="#">More options</a>
                     <ul class="dropdown-menu">
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
                     </ul>
                   </li>
                 </ul>
@@ -215,18 +215,18 @@
               <p class="muted">Left submenu</p>
               <div class="dropdown">
                 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
-                  <li><a tabindex="-1" href="#">Action</a></li>
-                  <li><a tabindex="-1" href="#">Another action</a></li>
-                  <li><a tabindex="-1" href="#">Something else here</a></li>
+                  <li><a href="#">Action</a></li>
+                  <li><a href="#">Another action</a></li>
+                  <li><a href="#">Something else here</a></li>
                   <li class="divider"></li>
                   <li class="dropdown-submenu pull-left">
-                    <a tabindex="-1" href="#">More options</a>
+                    <a href="#">More options</a>
                     <ul class="dropdown-menu">
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
-                      <li><a tabindex="-1" href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
+                      <li><a href="#">Second level link</a></li>
                     </ul>
                   </li>
                 </ul>
@@ -238,7 +238,7 @@
 &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"&gt;
   ...
   &lt;li class="dropdown-submenu"&gt;
-    &lt;a tabindex="-1" href="#"&gt;More options&lt;/a&gt;
+    &lt;a href="#"&gt;More options&lt;/a&gt;
     &lt;ul class="dropdown-menu"&gt;
       ...
     &lt;/ul&gt;
diff --git a/docs/javascript.html b/docs/javascript.html
index 3e9892843e..131924e0c9 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -405,21 +405,21 @@ $('#myModal').on('hidden', function () {
                     <li class="dropdown">
                       <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="http://google.com">Action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#anotherAction">Another action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                        <li role="presentation"><a role="menuitem" href="http://google.com">Action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#anotherAction">Another action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                         <li role="presentation" class="divider"></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                       </ul>
                     </li>
                     <li class="dropdown">
                       <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Another action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                         <li role="presentation" class="divider"></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -427,11 +427,11 @@ $('#myModal').on('hidden', function () {
                     <li id="fat-menu" class="dropdown">
                       <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
                       <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Another action</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                         <li role="presentation" class="divider"></li>
-                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                        <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -447,31 +447,31 @@ $('#myModal').on('hidden', function () {
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
                 <ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Another action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                   <li role="presentation" class="divider"></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                 </ul>
               </li>
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
                 <ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Another action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                   <li role="presentation" class="divider"></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                 </ul>
               </li>
               <li class="dropdown">
                 <a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
                 <ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop5">
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Another action</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Something else here</a></li>
                   <li role="presentation" class="divider"></li>
-                  <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
+                  <li role="presentation"><a role="menuitem" href="#">Separated link</a></li>
                 </ul>
               </li>
             </ul> <!-- /tabs -->