browsers, audio and setTimeout: differences?

browsers, audio and setTimeout: differences?

Hello all,

I have a function which loads a song, and, after a setTimeout, shows the title of the song and a link for new song. The function is attached to a link which displays as "#1";  the link for new song displays as "#2".

The setTimeout was determined by playing the song through the browser locally, and synchronising it to a certain phrase-- 34 seconds from the start of the song.

Online testing (OSX 10.11, clearing and disabling caches, private browsing) shows the effort to be precise is not working:
Safari displays at 25" and 26"; 
Opera at 31" and 34"; 
Firefox at 32"; 
Chrome at 32" and 33".
(all tested by hitting the audio stop button the instant the next link appears).

Can anyone clarify why this is happening?  

// loading and unloading songs

      function loadSong(fldr,song) {

      $('#song').fadeOut(400, function() {

$('#song').load(fldr +'/'+ song + '.htm', function() {

  $('#song').fadeIn(2400);   

      });  });

      }


// from the link to audio, show song title and next link

// t title id,  l link, d delay in seconds

      function upNexT(t, l, d){

      setTimeout( function() {

$('#' + l).fadeIn(2400); $('#titles #' + t ).fadeIn(3600);

                                                  }, d + '000');       

}


// link

<a href="#" id="ltex1" onclick="loadSong('latesongs','wreck'); 

                                                      upNexT('wreck', 'ltex2', '34');">#1</a>


//audio
<audio preload controls autoplay>

online:

choose option "AHA!"
choose "Texas"
click on "#1"

Cheers...