title: Keep an SVG Object static while scrolling
body: <p>In my web application, I am generating a SVG file which contains a "header" that I would like to keep visible at the top of the window as the user scrolls down the image.</p>
  
  <p>I can think of two ways of accomplishing this, but am looking for any other bright ideas.  My two thoughts are:</p>
  
  <ul>
  <li><p>Generate two separate SVGs, one being the "header" and one being the content and then simply displaying them in two different HTML <code>&lt;div&gt;</code> elements, allowing the lower one to scroll.  I don't like this idea because I would have to generate two separate documents.</p></li>
  <li><p>Utilise ECMAScript in the SVG itself and find a way to float the <code>&lt;g&gt;</code> that contains the header at the top of the page.  I like this, because whenever the SVG is viewed it should work, but I am not sure how to accomplish this and would appreciate any pointers or examples.</p></li>
  </ul>