Responsive overlay menu in fixed header

Issues related to hyperlinks and web site navigation.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/links.html
Post Reply
KIRK
 
 
Posts: 11
Joined: Fri Jul 08, 2016 3:51 pm

Responsive overlay menu in fixed header

Post by KIRK » Mon Nov 13, 2017 12:49 pm

Hello, I hope somebody have tips for me to resolve my proplems with the responsive overlay menu in a fixed header. I am about to build a new website and I would like to implement the following:

1. I would like to use the (payable) responsive overlay menu. I wish I could combine it with a fixed (on top of the page) responsive header. A logo on the left side of the header – the “hamburger” (responsive overlay menu) on the right side. If I set the header to position fixed, the close “x” from the menu is no more reachable/clickable. I think the (fix) header is in front and so the “x” is behind the header.
Is there a solution to solve this issue. For example to set a padding or so on, to have another position (under the fixed header) for the “x” close button.

2. It would be great if you could set the backround color of the hamburger button to transparent. So it would be possible to have a light translucent header.

I would like to work with layoutgrids if possible.

Thanks in advance for your support.

Dirk

User avatar
Pablo
 
Posts: 12681
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive overlay menu in fixed header

Post by Pablo » Mon Nov 13, 2017 1:14 pm

1. What is the URL of the page so I can see what you have done?

2. You can make the button background transparent by adding this code in Page HTML:

Code: Select all

<style>
#overlay-open-button
{
   background: transparent !important;
}
</style>

KIRK
 
 
Posts: 11
Joined: Fri Jul 08, 2016 3:51 pm

Re: Responsive overlay menu in fixed header

Post by KIRK » Mon Nov 13, 2017 1:57 pm

Hello Pablo,

thanks für the very quick reply. I will try it with the html code.

Here you can find an example. The closing "x" button is after expandig the overlay menu not reachable or clickable.

User avatar
Pablo
 
Posts: 12681
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive overlay menu in fixed header

Post by Pablo » Mon Nov 13, 2017 2:19 pm

The layout grid has a higher z-index than the overlay.

You can try this cdoe:

Code: Select all

<style>
#wb_LayoutGrid1
{ 
   z-index: 777 !important;
}
</style>

KIRK
 
 
Posts: 11
Joined: Fri Jul 08, 2016 3:51 pm

Re: Responsive overlay menu in fixed header

Post by KIRK » Mon Nov 13, 2017 2:43 pm

Perfect! Both codes working great.

Thanks a lot and a big compliment for the software and the very fast and uncomplicated service... :P

Post Reply

Who is online

Users browsing this forum: No registered users and 2 guests