Parallax Video Background - For Adobe Muse CC

Parallax Video Background Widget for Adobe Muse

• created: 06/17/2016
• latest update: 06/23/2016
• by: John Ramos - Muse For You
• email: john@museforyoushop.com

Welcome to the Parallax Video Background Widget by Muse For You

The Parallax Video Background Widget allows you to add multiple parallax video backgrounds to your Adobe Muse webiste. Change the height of each video and the parallax speed of each video. Set the image to 100% width by going to "Resize" in Adobe Muse and selecting "Stretch to Browser Width."

First add the "Add First - Parallax Video Background" widget to the top of your Adobe Muse website.

Afterwards add the "Parallax Video Background," widget to your Adobe Muse website.

Instance Number - If you have multiple parallax video backgrounds change the instance number for each instance of the widget.

Video Width (%) - Enter the width of the video within the website. The width is in percentage. If you set it to 100% width the video will fill the entire width of the widget container.

Image Height (px) - Enter the height you would like for the parallax video.

Select MP4 File - Select a .mp4 video file. It is recommended to have at least a .mp4 file. A .webm and .ogg/.ogv are optional and can be used for fallbacks for browsers that do not support .mp4 files.

Select Webm File - Select a .webm video file.

Select OGG File - Select a .ogg or .ogv video file.

Parallax Amount - The speed of the parallax movement. Choose between 1 and 2. 1 being no movement and 2 moving with the speed of the website.

Enable Parallax - Enable the parallax motion.

Disable Right Click On Video - If checked users will not be able to right click on the video.

Enable Autoplay - Automatically play the video when the website is loaded.

Loop Video - Loop the video once it is finished playing. This will work once the website is on a live server or when previewing on a localhost program i.e. MAMP.

Mute Audio - Mute the audio of the video.

• First add the "Add First - Parallax Video Background" widget to the top of your Adobe Muse website.

• The video will play in Google Chrome when building the website locally. Once it is uploaded to a live server the video will work on all browsers.

• The video will loop once it is on a live server or when previewing on a localhost program i.e. MAMP.

• It is recommended to have at least a .mp4 file. A .webm and .ogg/.ogv are optional and can be used for fallbacks for browsers that do not support .mp4 files.

• Set the video to 100% width by going to "Resize" in Adobe Muse and selecting "Stretch to Browser Width."

• If multiple breakpoints are present the video will pause when re-sizing the browser. Each time a new breakpoint is reached the website looks for the video again. Initially when viewing on different sized browsers or devices the video will play.

• The poster image will show for devices that do not support video autoplay i.e. mobile devices.

• You can have multiple parallax video backgrounds by changing the instance number for each widget.

I've used the following images, icons or other files as listed.

• backgroundVideo code by Samuel Linnett - linnett - https://github.com/linnett/backgroundVideo

Once again, thank you so much for purchasing this widget. I'd be glad to help you if you have any questions relating to this widget. If you have a more general question relating to this widget, you might consider visiting the forums and asking your question in the "Item Discussion" section.

-John Ramos

Muse For You