title: .slideToggle auto scroll down to reveal content
body: <p>I am using .slideToggle to open a panel when the user clicks a link:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt; 
  $(document).ready(function(){
  $(".btn-slide").click(function(){
  $("#panel").slideToggle("slow");
  $(this).toggleClass("active"); 
  
  return false;
  });
  });
  &lt;/script&gt; 
  </code></pre>
  
  <p>The content of the toggled div (#panel) is taller than the height of the containing div so scorllbars show up. I would like the vertical scrollbar to automatically scroll down to the reveal the new content when the div gets toggled. I think I could probably do this with .scrollTop to make this happen but Im not sure how to go about making it happen at the same time... Any ideas?</p>
  
  <p>EDIT: 
  There seems to be a consensus that this is the best way to go about achieving what I described:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){
      $(".btn-slide").click(function(){
          var $panel = $("#panel");
          $panel.slideToggle("slow");
          if ($panel.is(':visible')){
              $panel.parent().scrollTop($panel.height()-$panel.parent().height());
          }
          $(this).toggleClass("active"); 
  
          return false;
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>This makes the panel slide but the scroll down effect isn't working..</p>