Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Video Background - Locked to Section Height


Question

Site URL: https://esportsengine.gg/

Hi all! First time posting - I've tried to look up the answer on this, but haven't had any luck, so please let me know if this can be found elsewhere.

Anyways, I was wondering if I can replicate the look/design by using Squarespace found on this website: https://esportsengine.gg/

Specifically I'm looking at the 1st section (after the top banner) that has a red tinted video on the left with the words "WE WIN WHEN YOU WIN" on the right. It appears that the left side is a video and the right is a text block. But, when scaling the browser size, the video maintains it's aspect ratio and stays locked to the bottom and top of the section. Additionally, the words don't cross over onto the video, but instead maintain their positioning on white. On mobile the words appear beneath the video.

Is is something that is possible utilizing Squarespace? Any and all help is appreciated -- total coding newbie, so go easy on me, thank you!

Link to comment

3 answers to this question

Recommended Posts

  • 0
1 hour ago, TheDaTNetwork said:

Site URL: https://esportsengine.gg/

Hi all! First time posting - I've tried to look up the answer on this, but haven't had any luck, so please let me know if this can be found elsewhere.

Anyways, I was wondering if I can replicate the look/design by using Squarespace found on this website: https://esportsengine.gg/

Specifically I'm looking at the 1st section (after the top banner) that has a red tinted video on the left with the words "WE WIN WHEN YOU WIN" on the right. It appears that the left side is a video and the right is a text block. But, when scaling the browser size, the video maintains it's aspect ratio and stays locked to the bottom and top of the section. Additionally, the words don't cross over onto the video, but instead maintain their positioning on white. On mobile the words appear beneath the video.

Is is something that is possible utilizing Squarespace? Any and all help is appreciated -- total coding newbie, so go easy on me, thank you!

You can add video background to section and use css to make the effect available since section-background and section-content are 2 seperate divs

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
On 7/22/2021 at 1:17 AM, TheDaTNetwork said:

@bangank36 thanks so much for your reply. Unfortunately, as I'm very new to coding, I'm not sure how to do what you described. Is there any chance you could elaborate on how to accomplish that? Or, somewhere you can point me towards more answers? Thank you again!

Hi. Have you solved it yet?

Also do you need to fix these?

Site URL: https://esportsengine.gg/

1. (Tablet – Services) Number is cut off

https://esportsengine.gg/services

esportsengine.gg-01-min.png

2. (Mobile – Services) The same here

https://esportsengine.gg/services

esportsengine.gg-02-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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...