Skip to content

Instantly share code, notes, and snippets.

@Wilto
Created January 18, 2012 16:52
Show Gist options
  • Save Wilto/1634002 to your computer and use it in GitHub Desktop.
Save Wilto/1634002 to your computer and use it in GitHub Desktop.
(function($) {
$.fn.accessibleTabs = function(){
return this.each(function(e) {
var $el = $(this);
$el.find("li").keydown(function(e) {
var $el = $(this),
$prevTab = $el.prev().find('a'),
$nextTab = $el.next().find('a'),
$first = $el.parent().find("li:first a"),
$last = $el.parent().find("li:last a");
switch (e.which) {
case 37:
case 38:
if($prevTab.length) {
$prevTab.trigger('click').focus();
} else {
$last.trigger('click').focus();
}
e.preventDefault();
break;
case 39:
case 40:
if($nextTab.length) {
$nextTab.trigger('click').focus();
} else {
$first.trigger('click').focus();
}
e.preventDefault();
break;
}
});
$el.find("a").click(function(e) {
var $el = $(this),
$tab = $el.parent(),
$targetPage = $($el.attr('href'));
$el.attr({
'tabindex': 0,
'aria-selected': "true"
});
$targetPage
.show()
.siblings()
.hide();
$tab
.addClass('current')
.siblings()
.removeClass('current')
.find('a')
.attr({
'tabindex': -1,
'aria-selected': "false"
});
e.preventDefault();
});
$('[role="tabpage"]').not(':first').hide();
});
};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment