Full width submenu with transparent header

I’m on a tight time schedule, so if you could please help me as soon as you can, I’d appreciate it.

Thank you.

Hello. Thank you for replying.

I’m afraid I haven’t achieved what I need yet. I need my header & fullwidth menu to be transparent on pages where I use the fullscreen slider so that it is visible behind the menu/submenu etc. When I choose the header to be transparent the fullwidth submenu jumps up to the top of the page with a grey background.
Please check the link I’ve attached and let me know if you need more clarification.

Thanks again.

Hi. I’m afraid that didn’t work.

Hi. I’ve added the code and cleared the cache. Now the submenu has no grey background but it sits at the top of the page instead of under the header. Also it doesn’t look like it works as a menu.? I added a whitespace element but that didn’t work either?

Thanks.

Hi.

I removed the ‘contact-1-‘ menu item, as it was a trial page, so doesn’t need to be there.

Yes, you could temporarily deactivate the plugins. Basically do whatever you think would fix the menu situation! :-)

On my Enfold panel it says that there are no updates available.?!

Thank you.

I was wondering, can I upload the new Enfold version using my cPanel and not ftp?

Thank you.

Hi. I have now updated the theme. So if you could please have a look again at the fullwidth submenu (which seems to just be stuck to the top of the page) and let me know what you think.

Thank you so much for all your effort.

Hi. I’m afraid this didn’t help either.

Any ideas on how to resolve this? It’s strange that the minute I change the header to transparent the full-width submenu moves to the top of the page and it doesn’t even work!? Seriously stuck with this issue.

Thank you.

Hi.
Maybe I’ve confused things now, so sorry about that.
The header is transparent but the full-width menu is not at the right location. I’d like it to be below the header, as shown on the image in the attached link.
– I wasn’t sure how to send the screenshot through dropbox… :-/ –

Thanks again.

Thanks for your quick reply Andy.

I tried this code, but again the fullwidth submenu appears on top of the header. When I have a non transparent header everything appears normal; the minute I change it to transparent the submenu jumps to the top.

If this (the transparency) doesn’t work, maybe an idea would be to add a semi transparent background to both header and fullwidth submenu? Would that be more manageable?

Thank you.

Really sorry about the confusion with the links.

So, I did what you said and the code you added works in terms of bringing the submenu down, below the header, but the actual submenu doesn’t work – links aren’t clickable. And it also messes up the other pages.

Can I ask if there is a code that I can add to make the background of both header and fullwidth submenu semi transparent? Maybe this way it won’t jump up on the page and it will sort itself out?

Thank you.

Hi.

I did what you suggested and I tried to find a solution to it using a combination of codes… So I managed to sort it using these codes:

#top .av-subnav-menu > li { padding: 70px 0; }
#top .av-submenu-container { height: 30px; border: none!important; }
#top .sticky_placeholder { height: 0px!important; }

.main_color.av-submenu-container, .main_color .av-subnav-menu a {
background: transparent;
}
#sub_menu1 {
background: transparent!important;
}

But, if you look at link no.1 you can see it works fine. But then it doesn’t work for links no.2 & 3. Do you think you could possibly provide a code which applies the above code only to specific pages? I need it to be like this on all the portfolio items? I tried something myself but with no luck.

Thank you for your help.

Hi Andy,

I tried that, but didn’t work. It’s driving me insane at this stage!

Basically if I add #top .av-subnav-menu > li { padding: 70px 0; } works on one page (link 1) and if I add #top .av-subnav-menu > li { padding: 2px 0; } works on the other pages (link 2 & 3) but I can’t find a way to have both. When I added page-id in front didn’t make any difference.

Any other ideas?

Thanks again.

Hi.

Yes, I had tried that. I added the page-id and post-id giving different values to each, but it still didn’t fix it. It fixes one page but not the other. :-(

Thank you for trying to help. I think that there may be some kind of fault within the theme? Maybe? That the fullwidth submenu doesn’t respond well with a transparent header? At some point I removed all the Quick CSS code & deactivated all the plugins and the fullwidth submenu still jumped to the top when I changed my header to transparent.

I feel we have tried pretty much everything at this stage.

I do really like the theme and I even bought it again for another site, but it’s been driving me insane with this.

Let me know if there is something we haven’t tried so if there’s anything I’m doing wrong.

Thanks again.