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

Mobile menu overlay Squarespace 7.1


stellaehabib

Question

Site URL: https://www.leadwithbliss.com

Hello! I have added custom code to www.leadwithbliss.com (password: leadwithbliss), implemented in Squarespace 7.1, to overlay the mobile nav menu on the header banner image. I managed to achieve that with the following code:

.header-display-mobile {
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
}

However, I run into an issue upon scroll: the nav folder does not appear upon click of the hamburger menu (see attached screen shot - notice the 'x', indicating that the folder is open).

I suspect I am missing something fairly obvious with respect to bringing that element forward using position/z-index values but I can't quite seem to figure it out.

Does anyone have any suggestions on how to fix this? 

Thanks in advance for your help!

 

 

Screen Shot 2021-08-24 at 3.13.15 PM.png

Link to comment
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

4 answers to this question

Recommended Posts

  • 0

Hi,

Why you use this code?

.header-display-mobile {
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
}

" overlay the mobile nav menu on the header banner image"

Can you explain in detail this?

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
  • 0
On 8/28/2021 at 5:14 AM, stellaehabib said:

@tuanphan Yes so I had found this thread in which you provided a suggestion on how to achieve this look in the brine template on 7.0, I thought I would see if I could get it to work in 7.1

You mean transparent header on mobile only?

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