O'Reilly logo

Responsive Web Design with jQuery by Gilberto Crespo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Making responsive video elements

Before using HTML5 in our website development, the use of videos was restricted to the acceptance of Adobe Flash Player on devices. However, that obligation does not exist anymore because of the great effort in the development of <video> in HTML5, and also very powered by the positioning of Apple to deny Adobe Flash Player on their devices.

Currently, this element <video> is very well accepted in the existing devices and modern browsers (IE9 and later), making its handling and especially its flexibility on responsive websites much easier. Just to clarify, the following is how the video tag is commonly seen on DOM:

<video id="highlight-video" poster="snapshot.jpg" controls> <source src="video.m4v" type="video/mp4" ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required