title: jquery reload iframe after opening sliding panel
body: <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){
      $(".trigger").click(function(){
          $(".shoutpanel").toggle("fast");
          $(this).toggleClass("active");
          return false;
      });
  });
  &lt;/script&gt;
  
  &lt;a class="trigger" href="#"&gt;Shoutbox&lt;/a&gt;
  
  
  &lt;div class="shoutpanel"&gt;
  &lt;iframe id="shoutbox" name="shoutbox" width="350" height="480" src="tchat.php"&gt;
  &lt;/iframe&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This script will toggle a sliding panel with a shoutbox in it.
  If i put the shoutbox outside of the sliding panel then it will automatically scroll down as soon as it is loaded (to display the last shout)
  But for some unknown reason when i put the shoutbox inside the sliding panel, it won't scroll down unless i manually refresh it.</p>
  
  <p>So i am trying to find a workaround and i thought about setting the trigger script to automatically refresh the shoutbox iframe when it is executed. So when you click the trigger it would refresh the shoutbox after opening the sliding panel</p>
  
  <p>i'm not a jquery pro so i have not been able to do it myself... Basically i just need something like this:</p>
  
  <pre><code>$(document).ready(function(){
  $(".trigger").click(function(){
      $(".shoutpanel").toggle("fast");
      $(this).toggleClass("active");
      return false;
              document.getElementById(shoutbox).contentDocument.location.reload(true);
  });
  });
  </code></pre>