HTML5 Video Playback - image preload

html video image-preloader
David picture David · Nov 30, 2011 · Viewed 8k times · Source

I am using video tags and jQuery to display a HTML5 video playback.

How can I show an image while the video is still loading for displaying?

I would use jQuery for this..

Thanks in advance!

PD: Display an image when the video preloads.

Answer

Paul Graffam picture Paul Graffam · Nov 30, 2011

There is no need for JQuery to achieve this as the html5 video tag comes with its own poster attribute. You can use that to specify what image should be displayed while the video loads. For instance if you have an image called myImage.jpg you can do the following: <video controls="controls" poster="myImage.jpg">. Refer here for more info:

https://www.w3.org/wiki/HTML/Elements/video#HTML_Attributes

Related questions

Streaming via RTSP or RTP in HTML5

I'm building a web app that should play back an RTSP/RTP stream from a server http://lscube.org/projects/feng. Does the HTML5 video/audio tag support the rtsp or rtp? If not, what would the easiest solution be? …

Read More
HTML5 Video // Completely Hide Controls

How Could I completely hide HTML5 video controls? <video width="300" height="200" controls="false" autoplay="autoplay"> <source src="video/supercoolvideo.mp4" type="video/mp4" /> </video> false didn't work -- how is this done? Cheers.

Read More
changing source on html5 video tag

i'm trying to build a video player, that works everywhere. so far i'd be going with: <video> <source src="video.mp4"></source> <source src="video.ogv"></source> <object data="…

Read More