Jump to content

Parallax banner height

Recommended Posts

Hi!

I'm working on my webpage and I found multiple helpful codes from the forums. I'm still struggling on finding the code for the parallax banner.

Is there a CSS code for controlling height of an individual parallax banner for desktop view?

When I create new subpages on index page they are always nicely cropping the size to match the content/text in it (see image ''ideal size of banner''.
But whenever I add the picture the banner height is getting way too high compared to the content. (see the image '' too big banner'')
I know I can change the color of the background for the whole web page but I would like to use the colored background image just on few places and keep the rest whitish looking. That's why I chose the option of uploading a colored image without any better ideas.

I would need this code also for some other parallax banners, as they sometimes tend to make people scroll too much on the page.

Thanks for the help 🙂

Regards Sanni

ideal size of banner.jpg

too big banner.jpg

Link to comment
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

2 hours ago, Sanni said:

Hi!

I'm working on my webpage and I found multiple helpful codes from the forums. I'm still struggling on finding the code for the parallax banner.

Is there a CSS code for controlling height of an individual parallax banner for desktop view?

When I create new subpages on index page they are always nicely cropping the size to match the content/text in it (see image ''ideal size of banner''.
But whenever I add the picture the banner height is getting way too high compared to the content. (see the image '' too big banner'')
I know I can change the color of the background for the whole web page but I would like to use the colored background image just on few places and keep the rest whitish looking. That's why I chose the option of uploading a colored image without any better ideas.

I would need this code also for some other parallax banners, as they sometimes tend to make people scroll too much on the page.

Thanks for the help 🙂

Regards Sanni

ideal size of banner.jpg

too big banner.jpg

Can you share your site with the protected password so I can take a look?

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
  • 2 weeks later...

Hi!

Thanks! I found a simple code for changing the font and background colors so no need to upload blank image on the banner.
But I'm still struggling to find a solution for making parallax banner smaller. Is there a code for reducing the individual parallax banner height? 
I don't know how to share the webpage link as I'm currently having my main webpage launched and just viewing a template and editing it 🙂

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.