]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
Added accessibility to tabs. See issue 6888. 6914/head
authorMarius Olbertz <marius.olbertz@gmail.com>
Sun, 4 Oct 2015 01:31:32 +0000 (03:31 +0200)
committerMarius Olbertz <marius.olbertz@gmail.com>
Sun, 4 Oct 2015 01:31:32 +0000 (03:31 +0200)
js/foundation/foundation.tab.js

index c8a8bbf9c4bb427efdc5a412d511688bcc378983..fb0f172255174cced34a38fd289b3005decb9b16 100644 (file)
@@ -17,7 +17,7 @@
     default_tab_hashes : [],
 
     init : function (scope, method, options) {
-      var self = this, 
+      var self = this,
           S = this.S;
 
          // Store the default active tabs which will be referenced when the
       var usual_tab_behavior =  function (e, target) {
         var settings = S(target).closest('[' + self.attr_name() + ']').data(self.attr_name(true) + '-init');
         if (!settings.is_hover || Modernizr.touch) {
-          e.preventDefault();
-          e.stopPropagation();
+          // if user did not pressed tab key, prevent default action
+          var keyCode = e.keyCode || e.which;
+          if (keyCode !== 9) { 
+            e.preventDefault();
+            e.stopPropagation();
+          }
           self.toggle_active_tab(S(target).parent());
+          
         }
       };
 
         .off('.tab')
         // Key event: focus/tab key
         .on('keydown.fndtn.tab', '[' + this.attr_name() + '] > * > a', function(e) {
-          var el = this;
           var keyCode = e.keyCode || e.which;
-            // if user pressed tab key
-            if (keyCode == 9) { 
-              e.preventDefault();
-              // TODO: Change usual_tab_behavior into accessibility function?
-              usual_tab_behavior(e, el);
-            } 
+          // if user pressed tab key
+          if (keyCode === 13 || keyCode === 32) { // enter or space
+            var el = this;
+            usual_tab_behavior(e, el);
+          } 
         })
         // Click event: tab title
         .on('click.fndtn.tab', '[' + this.attr_name() + '] > * > a', function(e) {
       tab.addClass(settings.active_class).triggerHandler('opened');
       tab_link.attr({'aria-selected' : 'true',  tabindex : 0});
       siblings.removeClass(settings.active_class)
-      siblings.find('a').attr({'aria-selected' : 'false',  tabindex : -1});
-      target.siblings().removeClass(settings.active_class).attr({'aria-hidden' : 'true',  tabindex : -1});
+      siblings.find('a').attr({'aria-selected' : 'false'/*,  tabindex : -1*/});
+      target.siblings().removeClass(settings.active_class).attr({'aria-hidden' : 'true'/*,  tabindex : -1*/});
       target.addClass(settings.active_class).attr('aria-hidden', 'false').removeAttr('tabindex');
       settings.callback(tab);
       target.triggerHandler('toggled', [target]);