Skip to main content

Video Scroll

Add a video that plays as the user scrolls

Jørgen Wigum Lurvik avatar
Written by Jørgen Wigum Lurvik
Updated yesterday

The Video Scroll feature is a dynamic tool that adds a video to your page that plays as a user scrolls. It's a great way to make your website more engaging and visually dynamic. You can use it as a standalone section or embed it within other sections.

Adding Video Scroll in Vev

How to Add Video Scroll in Vev

  1. Add the Component: Add the Video Scroll component to your page from the Add Menu.

  2. Upload a Video: Once the component is on your canvas, you can either:

    • Upload a video directly from your computer.

    • Choose a video from Vev's Video Library by clicking "Select video."

Configuring the Video Scroll

Select the Video Scroll component and go to the right-side panel to access its configuration options.

  • Offset Video Start: Set a percentage value to determine when the video begins to play. For example, 0% means the video starts playing as soon as it becomes visible, while 50% means it starts when the component reaches the center of the screen.

  • Offset Video End: Set a percentage value to determine when the video stops playing, based on the viewport percentage.

  • Loop Count: Choose how many times the video will loop.

  • Loop Alternate Direction: Toggle this option to make the video play in the opposite direction after each loop.

Limitations

  • Frame Rate: The Video Scroll component generates a maximum of 12 frames per second, with a total maximum of 300 frames. For very long videos, this can result in a lower frame rate.

  • Video Length: For the best results and a smooth effect, it is recommended to use videos that are at least 25 seconds long.

  • Section Width: The Video Scroll section always covers 100% of the screen width and cannot be resized.

  • File Size: Videos should not exceed 512MB. If your video is larger, you should compress it or increase the playback speed to reduce its file size.

Tips for Optimal Performance

  • Keep videos short and engaging to maintain user interest.

  • Always compress large videos to ensure smooth playback without buffering.

  • Experiment with the offset settings to create the most impactful and seamless scrolling effect.

Did this answer your question?