title: Preload MP3 File before using the Play button
body: <p>I have the following code:</p>
  
  <pre class="lang-js prettyprint-override"><code>function playSound(source) {
      document.getElementById("sound_span").innerHTML =
          "&lt;embed src='" + source + "' hidden=true autostart=true loop=false&gt;";
  }
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;span id="sound_span"&gt;&lt;/span&gt;
  &lt;button onclick="playSound('file.mp3');"&gt;&lt;/button&gt;
  </code></pre>
  
  <p>Once you click play, the MP3 gets downloaded, than it starts to play. However, it can take a while if it has like 1 MB. What I need is a preloaded (just like you can do with the images). So when the page loads, the mp3 will be streamed and if, for instance, 10 seconds later, the user pressed the 'play' button, he won't have to wait until the mp3 gets downloaded first, as it is already streamed.</p>
  
  <p>Any ideas? Thanks in advance for any tip!</p>