Stop footer from reloading
Pre-HTML5 way

Sorry no, it is not easy nor stable. Footer is a part of HTML structure, and HTML is send with each request. You would need to remake a lot of Drupal to make it's navigation AJAX based to leave footer in place and reload just changes. I did it, once.

First problem is - if you change anything before #, browser will reload, it's mandatory. So you would need to send HTTP 204 No Content and hope user's browser really understands it. Then, JavaScript would need to detect answer like that, generate proper AJAX query. Or you could use js to insert # into every link and then send AJAX.

Either way, in PHP you would need to be able to serve stripped version of HTML structure. I did it by appending ?ajax=true and in theme stripping everything before and after my #main-container and sending only it's content. Of course if you use "# way", you cannot just paste content. You need to treat links inside.

Long story short, it was complicated, dirty, and worked like a magic. But worked all right.

HTML 5 way

Use &lt;audio&gt; tag like this:

&lt;audio autoplay loop&gt;
  &lt;source src="ambient.mp3"&gt;
&lt;/audio&gt;


And let the browser care.