Streaming live at 10am (PST)

Different Video background Desktop / Mobile?

#1

Hi there,

This project is about to finish and I’m now seeing a problem for the mobile version. In fact the video background is very large, this means that the happy guy is not visible on small screens. So I cropped the video and tried to replace the video “only” for the mobile version but it replaces also on the desktop version…

Any idea how to solve that inside webflow? Or do I need to add custom code?

Thanks!

Live: https://enginiumgroup.webflow.io/

https://preview.webflow.com/preview/enginiumgroup?utm_source=enginiumgroup&preview=658a129dc48ead4e6e83d6ccc6d4b2af


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

1 Like
#2

Hey @palombokevin

Not sure if you can replace the video using the same video bg element, but you can use a different bg element for mobile and just make it display none for desktop.

Piter :webflow_heart:

1 Like
#3

Hi Piter,

I can’t see the option for the video background to apply only on mobile. I added a sub class name but don’t work either…

1 Like
#4

You need to add a second video element and make it visible only on mobile. So the video element will have a class mobile-video and will be set to display none for desktop.

Piter :webflow_heart:

#5

@PiterDimitrov thanks but it auto replace desktop video. It’s “background video” maybe is that the problem?

#6

I’m talking about two video elements, not a combo class. I will record my screen and share a link here.

@palombokevin > https://www.useloom.com/share/cc52339ee9954d2d860b84a70defa6d2

1 Like
#7

Hahaa…Thank you so much @PiterDimitrov. With the video it’s cristal clear :slight_smile:

Cheers!

1 Like
#8

Great! Happy to help :webflow_heart:

1 Like