From 82380d5c2d6e20ce2509fa40d659245487b36809 Mon Sep 17 00:00:00 2001 From: Eric Kever Date: Tue, 16 Aug 2011 13:28:51 -0400 Subject: [PATCH] Removed 'Tab' suffix, tabs-content li's are now hidden by JavaScript instead of CSS. --- javascripts/app.js | 13 ++++++++++--- stylesheets/base.css | 2 +- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/javascripts/app.js b/javascripts/app.js index cf7a95f..4da5185 100644 --- a/javascripts/app.js +++ b/javascripts/app.js @@ -84,6 +84,11 @@ } }, + swapClass : function(element, from, to){ + Skeleton.removeClass(element, from); + Skeleton.addClass(element, to); + }, + addListener : function(element, on, fn, last){ last = (last || false); var BH; @@ -110,8 +115,10 @@ tabList = tabs[tabNum].getElementsByTagName("li"); for(var k = 0, l = tabList.length; k < l; k++){ + Skeleton.addClass(document.getElementById(tabList[k].getElementsByTagName("a")[0].href.substr(tabList[k].getElementsByTagName("a")[0].href.indexOf("#") + 1)), "hidden"); + Skeleton.addListener(tabList[k].getElementsByTagName("a")[0], "click", function(e){ - var contentLocation = this.href.substr(this.href.indexOf("#")) + "Tab", + var contentLocation = this.href.substr(this.href.indexOf("#")), contentElement, siblings; @@ -130,12 +137,12 @@ Skeleton.addClass(this, "active"); contentElement = document.getElementById(contentLocation.substr(1)); - Skeleton.addClass(contentElement, "active"); + Skeleton.swapClass(contentElement, "hidden", "active"); siblings = contentElement.parentNode.getElementsByTagName("li"); for(var m = 0, n = siblings.length; m < n; m++){ if(siblings[m] !== contentElement){ - Skeleton.removeClass(siblings[m], "active"); + Skeleton.swapClass(siblings[m], "active", "hidden"); } } } diff --git a/stylesheets/base.css b/stylesheets/base.css index 0496b54..1ad9383 100644 --- a/stylesheets/base.css +++ b/stylesheets/base.css @@ -254,7 +254,7 @@ border-top-right-radius: 2px; } ul.tabs-content { margin: 0; display: block; } - ul.tabs-content > li { display:none; } + ul.tabs-content > li.hidden { display: hidden; } ul.tabs-content > li.active { display: block; } /* Clearfixing tabs for beautiful stacking */