This was a problem that got me stuck for a day. JQuery just cannot seem to load an audio file because the return type is always a string.

The solution that I came up with was to use traditional Javascript code using XMLHttpRequest.

There could be JQuery plugins that can do this but I was not able to find any. Traditional XMLHttpRequest can still do a lot of wonders ;).

There may be cases where you want to download the whole audio file before loading it into the HTML5 Audio widget.

In my case, while it is easy to just set the URL to the source of the HTML5 Audio widget, it does not work if the URL is cross-domain.

Downloading the whole binary was the only solution that I came up with.

This can be done using plain Javascript. With JQuery however, there seems to be no way to do this because AJAX calls return a response type of string. Using traditional Javascript is no problem anyway.

See following code:

That’s it!

Imagine your dismay when the movie file you just downloaded has audio sync problems. Non techie people will usually look for another version of the movie file and download it again while those adept in video encoding will re-encode the video and audio and merge them as one.

Before doing those two I mentioned, there is a quick fix in your VLC Player that is nowhere to be found in any of its menu. With either two keypress of the keyboard, you can either delay the audio or increase its milliseconds.

Press ‘F’ for audio delay and ‘G’ for audio increase. Play around with it until the audio gets in sync with the video. This should work in Windows and Mac OSX versions of the VLC player.

Related Posts Plugin for WordPress, Blogger...