EverWeb Widgets

Responsive MP4 Video

When inserting MP4 video on a page that will be viewed on mobile devices, preload MUST be prevented and a poster image inserted to appear on page load. The image must have the same aspect ratio as the video file.
This widget prevents preload by default and also has the very useful function of pausing a video when another is played. Play the first video on this page and then click on the second one to see how the first will pause.

Video - Border - Plays Inline - FS Control - 2.39:1 Ratio

Responsive Container

The container is responsive width a maximum width setting and a percentage width slider. The container can have a border and/or a box shadow. When a box shadow is applied, the percentage width should be reduced to allow the shadow to be seen on mobile devices.
Caption
There is an optional caption which can be styled with a web safe or a Google hosted font and has controls for setting the font size, color, background, text-align and padding.
The caption should not really be regarded as an option and should contain keywords for the search engines as well as some info for the visitors.
Wrap
The full width wrapper can be styled for background color and its opacity and vertical spacing from the items above and below.

Video - Box Shadow - Plays Inline - No FS Control - 16:9 Ratio

Controls

There are checkboxes to show controls, play inline on iPhones, show fullscreen control and to set the initial volume. Unless the video file is high quality, it's better to hide the fullscreen control.
Autoplay and loop can be turned on if really necessary.
NOTE: To use autoplay in Safari for desktop and iOS the muted contol must be checked

© EverWeb Widgets -