I have a single page website which lists a collection of HTML5 audio players. The problem is the site has become slow because the following browsers start predownloading the content (mp3 and ogg)
Internet Explorer
Google Chrome
Firefox
Safari
(probably Opera)
I use the basic code to implement the players. Is there a way I can prevent the browsers from predownloading the audio files and only work when they click play?
<audio controls="controls" height="32" width="300" tabindex="0">
<source type="audio/mpeg" src="http://cdn.com/track.mp3"></source>
<source type="audio/ogg" src="http://cdn.com/track.ogg"></source>
</audio>
“disable download audio html5” Code Answer's Just add controlsList="nodownload" in your video tag.
The preload attribute specifies if and how the author thinks that the audio file should be loaded when the page loads. The preload attribute allows the author to provide a hint to the browser about what he/she thinks will lead to the best user experience.
HTML5 introduced <audio> tag, as well as the JavaScript APIs, which allow the browser to play audio without the need for an external plugin. The most supported codecs for playing audio in HTML5 are Ogg Vorbis, MP3, and Wav.
If you want to center your player, you can use the optional <div align="center"> tag. "controls" means the player displays the audio controls. Without it, the sound cannot be turned off.
<audio controls="controls" preload="none">
<source src="song.ogg" type="audio/ogg" />
<source src="song.mp3" type="audio/mpeg" />
Your browser does not support the audio element.
</audio>
Note - preload="none"
- can be used with VIDEO HTML5 and AUDIO HTML5.
The preload attribute is supported in all major browsers, except Internet Explorer and Opera.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With