Follow @magnawebstudio on Twitter Follow @magnawebstudio on Twitter
Follow /magnawebstudio on LinkedIn Follow /magnawebstudio on LinkedIn
awarded site
magna web studio
Contact us! Contact us!
WB-Developers' Corner
WB-Developers' Corner
       [rz] Background Video

This extension adds proportional full sized background videos to almost any object.

Some features:

- RWD and multi-instance.
- HTML5 with many fallbacks.
- Fallback resizable "paper" image.
- Custom playback rate, volume/mute.
- Tint simulation and patterns.
- Zoom for "empty bands" compensations.
- Fade and delays for start/end/loop.
- Seamless loop mode.
- Video deactivation breakpoint.
- Selectable target options.
- Pivots for advanced resize and location.
- Lightweight, no dependencies, no jQuery.

...and more!

W3C compliant


* Just a brief about some of the changes that were made lately...

* New in version 1.0.6

- Default behavior or force media playing on mobile devices.
- Improved buttons symbols uniformity across platforms.

* New in version 1.0.5

- Space around the instance in percentages and/or pixels; this allows to setup the background areas to not be covered.

* New in version 1.0.4

- Selectable specific scripts for new wb14 Carousel variants.
- Always playable video fallback in two modes for new Chrome policy (Apr 2018).
- Minor script improvements.

* New in version 1.0.3

- Optional, automatic and customizable button for sound/mute the background video.
- Extended sound level and mute handling at startup.
- Extended opacity variants for the optional buttons.

* New in version 1.0.2

- Optional, automatic and customizable button for play/pause the background video.

* New in version

- Improved startup on advanced scenarios.
- Improved behavior on [rz] Adaptive Framework and [rz] Block Framework.

* New in version

- Fixed a Safari mute status bug.
- Fixed a loop cycle issue due to a Safari bug.

* New in version 1.0.1

- New optional fading-in start mode.
- Improved delay-on-end timing.

How to use?

1. Design your page with its elements.
2. Drag and drop an extension instance.
3. Open the properties dialog and enter the video files and an image (and, optionally, you can
    customize the behavior and other parameters).
4.a. For layers background: Drag the extension instance and drop it within the layer.
4.b. For page background: Drag and drop the extension instance in the page.
4.c. For other objects background: Enter the id of the object you want to have the background.
5. Preview or publish.

w3c compliant
© 2012-20 by MAGNA web studio • all rights reserved

new shop with