Adding an eye-catching video that plays while the user scrolls can lift your project and create a truly memorable experience. Video scroll is available as an element or an entire section.
👍🏽 Adding video scroll
As an element
From the top menu bar, click on the Add Menu (
Shortcut: M)Search for and select Video Scroll
Drag and drop on the canvas
As a section
From the top menu bar, click on the Add Menu (
Shortcut: M)Search for and select Video Scroll
Hold Alt and click Add section here on the top or bottom of the canvas
Uploading a Video to Vev
Unlike other video elements in Vev, you won't be able to select your video from the Video Library. To upload your video;
Click on the Drop video files here tile
Select your video from your computer
Open it
You can also simply drop it over this tile and your video will be uploaded.
One of the major pain points with a feature like this is page speed and performance. To help solve this, there is no time limit on your videos, but we generate a maximum of 12 frames per second of video (1 frame = 1 image), up to a maximum number of 300 frames. Meaning that if you upload a video that is 5 hours long, you get one image per minute until 05:00:00 (since 5 hours = 300 minutes).
Therefore you'll need a video that lasts at least 25 seconds long for optimal results, we are actively working to bring out a new version that will support shorter videos.
Styling a Video Scroll
As a section
Spacing top: Add padding to the top of the section in pixels or % to keep spacing between sections
Spacing bottom: Add padding to the bottom of the section in pixels or % to keep spacing between sections
Width: The width of a section can't be altered, it'll always be set to cover the 100%
Height: Set the height of the section in Pixels, % or set it to Auto so that it grows as you add content to it
Min H: Sets the minimum amount of height pixels a section can be. A red stippled horizontal line inside your section will reflect the minimum height
Clip content: Toggle to hide the content that goes beyond the section's edges
Resize to fill vertically: Click to set the section's height to 100%
⚙️ Configuration Options
Once you've added the Video scroll element or section to your canvas, it's time to upload your video file and adjust the configurations.
To start, select your Scroll Video element and go to the right-side panel.
Parameter | Description |
Offset video start | Move the video start position with % of the viewport. If video start is at 0% the video will start to scroll the instant any part of it becomes visible. in the viewport. If you want the video start while it hits the center of the screen, use 50% as the offset video start. |
Offset video end | Move the video end position with % of the viewport. |
