title: Maintaining scroll position between page loads with JavaScript
body: <p>I'm a novice who understands HTML5 and CSS3 but not JavaScript all that well. I'm trying to keep my browser maintained in the same scroll position while I click between different pages on my site. These pages are illustration.html, design.html and brochures.html. The Jump back to the top each time I load a new page is becoming a little frustrating. So here is an example of my HTML5 below.</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
          &lt;html lang="en"&gt;
              &lt;head&gt; 
                  &lt;script src="../js/browser.js" type="text/javascript"&gt;&lt;/script&gt;
              &lt;/head&gt;
              &lt;body&gt;
                  &lt;section&gt;   
                       &lt;header&gt;&lt;title&gt;design&lt;/title&gt;&lt;/header&gt;
                          &lt;article&gt;
                                   &lt;div id="illustration"&gt;
                                      &lt;a href="illustration.html"&gt;illustration&lt;/a&gt;
                                  &lt;/div&gt;
  
                                  &lt;div id="design"&gt;
                                       &lt;a href="#"&gt;design&lt;/a&gt;
                                   &lt;/div&gt;
  
                                   &lt;div id="brochures"&gt;
                                       &lt;a href="brochure.html"&gt;brochures&lt;/a&gt;
                                  &lt;/div&gt;
                           &lt;/article&gt;
                  &lt;/section&gt;
              &lt;/body&gt;
          &lt;/html&gt;
  </code></pre>
  
  <p>Is there a simple piece of JavaScript to keep my scroll position in place while clicking between pages?</p>