Apache :: HTML5 Media Loading Sometimes Suspends Or Aborts

Recently, some code on a web application that has been working fine for months started to run unexpectedly. That code is just a media files loading JavaScript function, that uses jQuery. It's pretty long, but in essence it is like this:

Code:
var $audio=$('<audio>');
$audio.on('canplaythrough',function(e){
$audio[0].play();
});
$audio.attr('src','song.ogg');

Basically, the file only loads sometimes, and sometimes stops loading with a suspend or even an abort event.

I have uploaded a little testing HTML to [URL] .... , where you can see what's happening. You can download the test files from[URL] .... for local testing.

I have just checked that opening the test index.html file directly into Firefox, and not through my localhost Apache server, makes the audio files perfectly playable. So, I assume, my hosting and I have the Apache server misconfigured for serving media files.

My software versions are: Linux Mint 13, Apache 2.2.22-1ubuntu1.7 , Mozilla Firefox 31.0 , Chromium 36.0.1985.125 and jQuery 1.11.0.

My Apache server configuration is very basic. I have just installed the package, alongside the php mod, and modified very little on the conf file. I think the problem is not related to my specific configuration, and many other people would be able to reproduce it on they own.

I have checked the Apache error.log after a suspended loading, but nothing was added to it.