title: I made my own version of jquery tabs but I need external link to show tab content & style original nav
body: <p>I attempted to add onto this tabs script in jquery that I found. Seems like I've complicated it more than it needs to be. I know this is very easy to do with jquery tabs but I have attempted to make my own version to learn. The vertical tabs work fine but I need the bottom links to do the same thing as the vertical nav buttons &amp; change nav button styling like vertical nav does including background color,etc. There will be external links at the bottom in #footer so keep that in mind as well.</p>
  
  <p>here is the <a href="http://jsfiddle.net/BD4QS/2/" rel="nofollow">fiddle</a></p>
  
  <pre><code> $(function(){
  
   // This is for when vertical navigation on left side of #content is clicked 
   $('#sidemenu a').on('click', function(e){
   e.preventDefault();
  
   if($(this).hasClass('open')) {
    // do nothing because the link is already open
   } else {
    var oldcontent = $('#sidemenu a.open').attr('href');
    var newcontent = $(this).attr('href');
  
  
    $(oldcontent).fadeOut('fast', function(){
      $(newcontent).fadeIn('fast').removeClass('hidden');
      $(oldcontent).addClass('hidden');
    });
  
  
    $('#sidemenu a').removeClass('open');
    $(this).addClass('open');
    }
   });
  
   // This is for when bottom links are clicked
   $('#footer a').on('click', function(e){
   e.preventDefault();
   var oldcontent = $('#sidemenu a.open').attr('href');
   var newcontent = $(this).attr('href');
   // Check if $(this) element links to a tab content or external
   if($(this).hasClass('open-tab')){
       if (oldcontent == newcontent){
          // If this tab is already open, do nothing to page
       } else {
           $('#content ' + String(oldcontent)).fadeOut('fast', function(){
           $(newcontent).fadeIn('fast').removeClass('hidden');
           $('#content ' + String(oldcontent)).addClass('hidden');
           });
  
           $('#sidemenu a').removeClass('open');
           $('#sidemenu a ' + newcontent).addClass('open');
       }
   } else{ 
     //just use href link to whatever the element's href attribute is
     window.open($(this).attr('href'));
   }
  
  
   });
  
  
   });
  </code></pre>