Team:Uppsala/Templates/TselectTier2

From 2014.igem.org

(Difference between revisions)
Handin (Talk | contribs)
(Created page with "<div id="tab_selector"> <ul id="tabs"> <li><a href="#" title="tab1">One</a></li> <li><a href="#" title="tab2">Two</a>...")
Newer edit →

Revision as of 12:03, 16 July 2014

  • <a href="#" title="tab1">One</a>
  • <a href="#" title="tab2">Two</a>
  • <a href="#" title="tab3">Three</a>
  • <a href="#" title="tab4">Four</a>
One - content
Two - content
Three - content
Four - content

<script>

$(document).ready(function() {

   $("#section_selector div").hide(); // Initially hide all content
   $("#tabs li:first").attr("id","current"); // Activate first tab
   $("#section_selector div:first").fadeIn(); // Show first tab content
   
   $('#tabs a').click(function(e) {
       e.preventDefault();        
       $("#section_selector div").hide(); //Hide all content
       $("#tabs li").attr("id",""); //Reset id's
       $(this).parent().attr("id","current"); // Activate this
       $('#' + $(this).attr('title')).fadeIn(); // Show content for current tab
   });

})();

</script>