Team:Gaston Day School

From 2014.igem.org

(Difference between revisions)
Line 71: Line 71:
       // Grab the tab links and content divs from the page
       // Grab the tab links and content divs from the page
       var tabListItems = document.getElementById('tabs').childNodes;
       var tabListItems = document.getElementById('tabs').childNodes;
-
       for ( var i = 0; i < tabListItems.length; i++ ) {
+
       for ( var i = 0; i < tabListItems.length; i++ )  
-
         if ( tabListItems[i].nodeName == "LI" ) {
+
      {
 +
         if ( tabListItems[i].nodeName == "LI" )  
 +
        {
           var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' );
           var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' );
           var id = getHash( tabLink.getAttribute('href') );
           var id = getHash( tabLink.getAttribute('href') );
Line 84: Line 86:
       var i = 0;
       var i = 0;
-
       for ( var id in tabLinks ) {
+
       for ( var id in tabLinks )  
 +
      {
         tabLinks[id].onmouseover = showTab;
         tabLinks[id].onmouseover = showTab;
         tabLinks[id].onfocus = function() { this.blur() };
         tabLinks[id].onfocus = function() { this.blur() };
Line 227: Line 230:
</div>
</div>
<div class="tabContent" id="measure">
<div class="tabContent" id="measure">
-
   <h2>Project</h2>
+
   <h2>Measurement Track</h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>
<div class="tabContent" id="parts">
<div class="tabContent" id="parts">
-
   <h2>Project</h2>
+
   <h2>Parts</h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>
<div class="tabContent" id="modeling">
<div class="tabContent" id="modeling">
-
   <h2>Project</h2>
+
   <h2>Models</h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>
<div class="tabContent" id="notebook">
<div class="tabContent" id="notebook">
-
   <h2>Project</h2>
+
   <h2>Notebook</h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>
<div class="tabContent" id="safety">
<div class="tabContent" id="safety">
-
   <h2>Project</h2>
+
   <h2>Safety/h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>
Line 251: Line 254:
</div>
</div>
<div class="tabContent" id="igem">
<div class="tabContent" id="igem">
-
   <h2>Project</h2>
+
   <h2>Homepage</h2>
     <p> Derp </p>
     <p> Derp </p>
</div>
</div>

Revision as of 13:20, 11 June 2014

Home

JavaScript tabs partition your Web page content into tabbed sections. Only one section at a time is visible.

The code is written in such a way that the page degrades gracefully in browsers that don't support JavaScript or CSS.

Team

derp derp derp

Project

Derp

Measurement Track

Derp

Parts

Derp

Models

Derp

Notebook

Derp

Safety/h2>

Derp

Project

Derp

Homepage

Derp