title: Dynamically change iframe's content
body: <p>I have an iframe tag and I want to dynamically change it using jquery animation. So for example the iframe sits on the home page, and if i click the about link, it will load the about.html and when its ready it will slide it down using animation.
  I have the basic logic for it but then came about this</p>
  <p><strong>problem:</strong></p>
  <p>When I refresh the page it loads back the content of the index.html page, and what I want is that when I refresh it, it still keeps the contents of about.html.<br/></p>
  <pre><code>  &lt;a href=&quot;about.html&quot; target=&quot;content&quot;&gt;About&lt;/a&gt; 
    &lt;iframe id=&quot;content&quot; name=&quot;content&quot; align=&quot;top&quot; src=&quot;index.html&quot; 
        frameborder=&quot;0&quot; width=&quot;100%&quot; height=&quot;1200px&quot; scrolling=&quot;no&quot;&gt;
    &lt;/iframe&gt;
  </code></pre>
  <p>this is just the most basic logic, but I need help on how do I achieve the refreshing part/</p>
  <p>and what if i dont include them in the same page but I still want to animate the page transitions. so when the users clicks a link to a new page, it will load it, and then animate it.How can I achieve this. Because recently I saw a jquery plugin callen LocalScroll and they achieve this effect, but i couldnt get it to work for new pages</p>