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

Transparent Nav on Image Gallery


Sera

Question

Site URL: https://tangerine-iguana-kwg3.squarespace.com/

Hello there, 

I was hoping to get some help in a couple of areas within the header:
- I have an image gallery on the homepage and for some reason the nav is no longer transparent above the gallery, but it is on my other pages. Is there a way to get the image gallery to be full bleed? It looks like the issue is the spacing as it is placed below the nav, unlike other full bleed content.

- Additionally, I was also trying to find a way to have an alternate header image show up on mobile vs. desktop as the gallery images gets cropped significantly. Unsure if there is a solve for this, but thought to ask regardless, thanks a lot! 

https://tangerine-iguana-kwg3.squarespace.com/

Password: MaintainS134!

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Fantastic, thank you so much! This is exactly what I needed. And as far as using an alternate image in Mobile view, is that possible at all?  Thanks again, Anna  

the selectors for 1st 2nd 3rd is from top to bottom, kindly replace your own images section[data-section-id="5faddfad2bb93a1ea28b510b"] { padding-top: 0 !important; } @media only screen a

Thank you so much @bangank36 - it worked!!

Posted Images

4 answers to this question

Recommended Posts

  • 0

Is this what you want, let's copy the custom css in place

image.thumb.png.4d83bdb4222299acffca32fa27520494.png

section[data-section-id="5faddfad2bb93a1ea28b510b"] {
  padding-top: 0 !important;
}

 

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 lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
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 post
  • 0
19 minutes ago, Sera said:

Fantastic, thank you so much! This is exactly what I needed.

And as far as using an alternate image in Mobile view, is that possible at all? 

Thanks again,

Anna

 

the selectors for 1st 2nd 3rd is from top to bottom, kindly replace your own images

image.thumb.png.7e6b5d2769061f52b47aa1b6ebf4340e.png

section[data-section-id="5faddfad2bb93a1ea28b510b"] {
  padding-top: 0 !important;
}

@media only screen and (max-width: 768px) {
  section[data-section-id="5faddfad2bb93a1ea28b510b"] .gallery-fullscreen-slideshow-item-img img {
  display: none;
}
section[data-section-id="5faddfad2bb93a1ea28b510b"] .gallery-fullscreen-slideshow-list .gallery-fullscreen-slideshow-item:nth-child(1) .gallery-fullscreen-slideshow-item-img {
    background: url(https://placeimg.com/640/480/any) no-repeat;
    background-size: cover;
  }
section[data-section-id="5faddfad2bb93a1ea28b510b"] .gallery-fullscreen-slideshow-list .gallery-fullscreen-slideshow-item:nth-child(2) .gallery-fullscreen-slideshow-item-img {
    background: url(https://placeimg.com/640/480/any) no-repeat;
    background-size: cover;
  }
section[data-section-id="5faddfad2bb93a1ea28b510b"] .gallery-fullscreen-slideshow-list .gallery-fullscreen-slideshow-item:nth-child(3) .gallery-fullscreen-slideshow-item-img {
    background: url(https://placeimg.com/640/480/any) no-repeat;
    background-size: cover;
  }
}

 

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 lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
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 post

Create an account or sign in to comment

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


×
×
  • Create New...