How to prevent html5 video from loading before playing?

html video html5-video
Will Ryan picture Will Ryan · Jan 13, 2013 · Viewed 47.3k times · Source

I have several html5 videos on one page and I've just realized that when you visit the page, all the videos start loading even though I haven't clicked play on any of them.

Is there a way to only load a video once you click play, to prevent unnecessary downloading?

Answer

Timothy Radzikowski picture Timothy Radzikowski · Jan 13, 2013 
<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls="controls" preload="none">
  <source src="movie.mp4" type="video/mp4" />
  <source src="movie.ogg" type="video/ogg" />
  Your browser does not support the video tag.
</video>

</body>
</html>

Use Preload"none"

http://diveintohtml5.info/video.html

Related questions

Is there a way to make HTML5 video fullscreen?

Is there a way to play a video fullscreen using the HTML5 <video> tag? And if this is not possible, does anybody know if there is a reason for this decision?

Read More
Play infinitely looping video on-load in HTML5

I'm looking to place a video in an HTML5 page that will begin playing on page-load, and once completed, loop back to the beginning without a break. The video should also NOT have any controls associated with it, and either …

Read More
Detect if HTML5 Video element is playing

I've looked through a couple of questions to find out if an HTML5 element is playing, but can't find the answer. I've looked at the W3 documentation and it has an event named "playing" but I can't seem to get …

Read More