8b05d2bb35
If this is not done, then the active class remains on the tab that was initially visible on page load - even if this tab is now hidden and no longer active. This is confusing when trying to target CSS as a the selector "ul.tabs-content > li.active" , may not be visible. Also removed unused tabsContent variable.
41 lines
878 B
JavaScript
41 lines
878 B
JavaScript
/*
|
|
* Skeleton V1.0.2
|
|
* Copyright 2011, Dave Gamache
|
|
* www.getskeleton.com
|
|
* Free to use under the MIT license.
|
|
* http://www.opensource.org/licenses/mit-license.php
|
|
* 5/20/2011
|
|
*/
|
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
/* Tabs Activiation
|
|
================================================== */
|
|
var tabs = $('ul.tabs');
|
|
|
|
tabs.each(function(i) {
|
|
//Get all tabs
|
|
var tab = $(this).find('> li > a');
|
|
tab.click(function(e) {
|
|
|
|
//Get Location of tab's content
|
|
var contentLocation = $(this).attr('href') + "Tab";
|
|
|
|
//Let go if not a hashed one
|
|
if(contentLocation.charAt(0)=="#") {
|
|
|
|
e.preventDefault();
|
|
|
|
//Make Tab Active
|
|
tab.removeClass('active');
|
|
$(this).addClass('active');
|
|
|
|
//Show Tab Content & add active class
|
|
$(contentLocation).show().addClass('active').siblings().hide().removeClass('active');
|
|
|
|
}
|
|
});
|
|
});
|
|
|
|
}); |