Play infinitely looping video on-load in HTML5

by

The loop attribute should do it:

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

The addition of the unintuitive muted attribute is required by Chrome as documented on their dev site.

Should you have a problem with the loop attribute (as we had in the past), listen to the videoEnd event and call the play() method when it fires.

Note1: I’m not sure about the behavior on Apple’s iPad/iPhone, because they have some restrictions against autoplay.

Note2: loop="true" and autoplay="autoplay" are deprecated

More Related Contents:

  1. Play local (hard-drive) video file with HTML5 video tag?
  2. Is there a way to make HTML5 video fullscreen?
  3. HTML5 live streaming
  4. Html Video player plays sound but not video
  5. Streaming a video from Google Drive using HTML5 video tag
  6. Safari – Videos load far too slowly
  7. html5 video safari downloads full before playing
  8. Image placeholder fallback for HTML5 Video
  9. How to prevent downloading images and video files from my website?
  10. Retrieving HTML5 video duration separately from the file
  11. Another: Force Chrome to fully buffer mp4 video
  12. Programmatically play video with sound on Safari and Mobile Chrome
  13. Wait until an HTML5 video loads
  14. Playing m3u8 Files with HTML Video Tag
  15. HTML5 video element request stay pending forever (on chrome)
  16. html5 video not working on ipad
  17. plays in other browsers, but not Safari
  18. HTML5 Video not working in IE 11
  19. preparing mp4 file for html 5
  20. html5 video tag codecs attribute
  21. Hls video streaming on iOS/Safari
  22. HTML5 – mp4 video does not play in IE9
  23. How to set the thumbnail image on HTML5 video?
  24. HTML5 and Javascript to play videos only when visible
  25. Play HTML5 Video when scrolled to
  26. html5 video issue with chrome
  27. YouTube URL in Video Tag
  28. How to hide full screen button of the video tag in HTML5
  29. HTML5 Video: Streaming Video with Blob URLs
  30. Making youtube.com/embed URLs work on iOS

Leave a Comment