Full site BG video

Design help General
1

Hi, does anyone know if it’s possible to achieve a full page background video similar to this?

Thanks

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

3

Hi Theo,

This should be easily done by adding a background video element and giving it the following styles: Width: 100%, Height: 100vh, Position: fixed, Top: 0px and Z-index: -1.

This would make the video act as an background and keep it’s position fixed when scrolled. :slight_smile:

4

Hi David, thanks a lot for that! I’ll give it a go now!
cheers
Theo

5

Works perfectly, thanks so much!

6

Sorry David, 1 more thing, do you think you could do the same with an html embed for a Vimeo stream?
Thanks

7

Yep, instead of adding the styles to a background video element, add them to the html embed element. Then remember to add width: 100% and height: 100% inside of the iframe.

8

You’re a star! cheers mate

9

Hmm, doesn’t seem to work on the width only the height, it’s keeping the aspect ratio, might be something to do with the stream I guess?

10

Can you share a read-only link and a published link, so I can take a look? :slight_smile:

11

here you go. I appreciate this!

https://preview.webflow.com/preview/theo-home?utm_medium=preview_link&utm_source=designer&utm_content=theo-home&preview=e8e25e1bcc4691129850492e8106cdec&pageId=5f804d128de7ee5d1b0efd02&mode=preview

12

sorry, here’s the actual ones

https://preview.webflow.com/preview/theo-home?utm_medium=preview_link&utm_source=designer&utm_content=theo-home&preview=05722fa30bf9a33f9e058a3f98fbae7b&pageId=5f804d128de7ee5d1b0efd02&mode=preview

live link: