title: show a div and go to the anchor
body: <p><strong>Hello</strong></p>
  
  <p>Is there any way to let this code work!
  I am trying to show the DIV (slidingDiv) and go to the selected ANCHOR (#anchor-01 + #anchor-02 + #anchor-03)...
  This code let me only go to the first line in the DIV.
  So please, how can jump/scrool to the exact anchor?
  THanks</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Test show hide tab&lt;/title&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
      $(document).ready(function(){
      $(".slidingDiv").hide();
      $(".show_hide").show();
      $('.show_hide').click(function(){
      $(".slidingDiv").slideToggle();
      });
      });
      &lt;/script&gt;
  
      &lt;style type="text/css"&gt;
          .slidingDiv {
          background-color: #99CCFF;
          padding:20px;
          margin-top:10px;
          border-bottom:5px solid #3399FF;
          }
          .show_hide {
          display:none;
          }
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;a href="#anchor-01" class="show_hide"&gt;Show/hide 01&lt;/a&gt; -- &lt;a href="#anchor-02" class="show_hide"&gt;Show/hide 02 &lt;/a&gt; -- &lt;a href="#anchor-03" class="show_hide"&gt;Show/hide 03&lt;/a&gt;
  &lt;hr&gt;
  
  &lt;div class="slidingDiv"&gt;
  
      &lt;div id="anchor-01"&gt;
          &lt;h2&gt;Tite for link anchor  01&lt;/h2&gt;
          Fill this space with really interesting content. &lt;a href="#" class="show_hide"&gt;hide&lt;/a&gt;
          &lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
      &lt;/div&gt;
  
      &lt;div id="anchor-02"&gt;
          &lt;h2&gt;Tite for link anchor  02&lt;/h2&gt;
          Fill this space with really interesting content. &lt;a href="#" class="show_hide"&gt;hide&lt;/a&gt;
          &lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
      &lt;/div&gt;
  
      &lt;div id="anchor-03"&gt;
          &lt;h2&gt;Tite for link anchor  03&lt;/h2&gt;
          Fill this space with really interesting content. &lt;a href="#" class="show_hide"&gt;hide&lt;/a&gt;
          &lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;br&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>