Jump to content

How to set a different video background on mobile

Recommended Posts

Hey everyone,

Having trouble using sources found elsewhere online so giving this a go.

I have uploaded a video background on desktop view but the orientation isn't mobile friendly. I have made a portrait version for mobile but I am having trouble hiding the desktop video and only showing the mobile video.

Is there a way to only show the desktop video on desktop screens and the mobile video on mobile screens?

How do I go about doing this?

My site isn't live yet but I have attached the videos I am using.

Thank you!

Link to comment

@RebeccaSwales Hi! You can publish your site with a site-wide password.

To achieve the effect you're looking for, you can create a new section with the portrait video background below the existing one. Then, with custom CSS, we can ensure that only one section is visible depending on the screen size, either desktop or mobile. Once you've created this section, share your site URL, and I can share the code.

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.