title: How can I link directly to a specific JavaScript tab?
body: <p>My website has a tabbed interface that is used consistently throughout all of the pages. I can link to the base page (the first tab), but can't figure out how to link to a specific tab.</p>
  
  <p>This is my JavaScript:</p>
  
  <pre><code>$(document).ready(function() {
    $(".tabs a").click(function() {
      var $this = $(this);
      $(".panel").hide();
      $(".tabs a.active").removeClass("active");
      $this.addClass("active").blur();
      var panel = $this.attr("href");
      $(panel).fadeIn(250);
      return false;
    });
  $(".tabs li:first-of-type a").click();
  });
  </code></pre>
  
  <p>And each of my pages is set up like this:</p>
  
  <pre><code>&lt;div id="aboutContainer"&gt;
      &lt;ul class="tabs"&gt;
          &lt;li&gt;&lt;a href="#panel1"&gt;About Us&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#panel2"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#panel3"&gt;Mailing List&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#panel4"&gt;Terms&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#panel5"&gt;Privacy Policy&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#panel6"&gt;Help&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
          &lt;div class="panelContainer"&gt;
              &lt;div class="panel" id="panel1"&gt;
                  &lt;?php include('includes/aboutme.php'); ?&gt;
              &lt;/div&gt;
  
              &lt;div class="panel" id="panel2"&gt;
                  &lt;?php include('includes/contact.php'); ?&gt;
              &lt;/div&gt;
  
              &lt;div class="panel" id="panel3"&gt;
                  &lt;?php include('includes/mailinglist.php'); ?&gt;
              &lt;/div&gt;
  
              &lt;div class="panel" id="panel4"&gt;
                  &lt;?php include('includes/terms.php'); ?&gt;             
              &lt;/div&gt;
  
              &lt;div class="panel" id="panel5"&gt;
                  &lt;?php include('includes/privacypolicy.php'); ?&gt;
              &lt;/div&gt;
  
              &lt;div class="panel" id="panel6"&gt;
                  &lt;?php include('includes/cheekyreference.php'); ?&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Any pointers would be greatly appreciated. I'm pretty new to JavaScript and haven't been able to find an answer searching the web.</p>
  
  <p>To clarify things a little:</p>
  
  <p>If I'm on the about.php page, the tabbed interface works. But the kind of link I'm trying to make is as follows: If I were on another page, I'd like to link to a particular tab on the about page. I have a navigation footer and I'd like to be able to click on a hyperlink such as 'mailing list' or 'contact' and have the correct page show up as well as the correct tab.</p>