Background Video on Website

Design help General
1

Hey guys,y

I’m having some problems getting my “background” video to fill the entire website I’m trying to create.

Here’s the share link: https://preview.webflow.com/preview/aniruddh?preview=9f36f30fbfad35e8194f62644c50cd8a

Any ideas?

2

Hey @mYst1X try this:

For embed code:

<video muted autoplay loop><source src="https://dl.dropboxusercontent.com/s/nbgxh74ourbxrur/Hello-World.mp4" style="height:100vh;"/></video>

For style settings:
Position: Fixed, Full
Height: 100vh (view height, takes the height of the viewer screen)

242×995 90.1 KB

And remove the transform from the embed block. :slight_smile:

Recommendation, only display video backgrounds on desktop. Certain browsers/devices only support certain kinds of videos, and this is only serving up one kind of video format. I recommend using EastHTML5Video for video format exporting. :slight_smile:

Please let me know if you have any other questions. :smile:
Thanks,

Waldo

3

Hey Waldo,

There is no 100 VH option for me. The only suffixes for 100 are px, AUTO, and %

4

And right now, on my website (http://aniruddh.webflow.io/), the video is being “covered” up by the rest of my content. Why is that?

5

@mYst1X you can type in “100 VH” for height or “100 VW” for width :slight_smile:

When I checked earlier today (sorry was absolutely swamped today) you had the video background working perfectly. Though I’m now on a macbook and was on a pc earlier. Please let me know if you have any questions. Your site was looking great with the video background. :smiley:

Please let me know if you need any help getting it setup. You have built and are building a VERY strong resume. :slight_smile:

Waldo

6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.