Tagged: sticky header
-
AuthorPosts
-
July 12, 2022 at 7:11 pm #1358114
Hi,
Ive got a top a transparent header that appears on scroll down
and set to be sticky.My client would like the header to hide again when it reaches my footer
(which is a custom page, with a 100% height colour element)So is it possible to hide the header when the scroll reaches a certain ID
or even for it to remain sticky but then stick to a certain point.Like the reverse of the full width sub menu which sticks when you scroll to it.!
July 12, 2022 at 7:37 pm #1358119I’ve also tried to add a custom ID to the footer colour section
and then added some custom css
#mmfooter{
z-index:600!important;
}July 12, 2022 at 7:41 pm #1358121Hey smudgedesign,
Thanks for your question, I recently worked on a solution for something similar to this, please review this thread
basically, you add a custom class: waypoint-trigger to an element on the page and when it is in view the script will hide the header.
if you find you need some help setting it up please include an admin login in the Private Content area.Best regards,
MikeJuly 13, 2022 at 10:34 am #1358180Mike you’re a legend.
Exactly what i needed thank you.However it currently just works when i have the header invisible until the user scrolls.
On another page / post where the header is visible and sticky it doesn’t seem to hide
when it hits the trigger point.Would you know of a workaround?
- This reply was modified 2 years, 5 months ago by smudgedesign.
July 13, 2022 at 6:40 pm #1358240Hi,
Thank you for the link to your pages, but I’m not sure why this is occurring, I linked to my demo page below which is currently “header visible and sticky”, I also tested different header settings and it worked for my demo each time.
Are you manually managing Builder Elements in Enfold Theme Options ▸ Performance ▸ Disable Template Builder Elements?
Please include an admin login in the Private Content area so we can investigate, are there any other pages where this is not working?Best regards,
MikeJuly 14, 2022 at 12:00 pm #1358312Hi Mike
It seems to only work for me with header hidden until scrolling is set.
It’d be great if you could investigate further, i’ve provided login details belownote the javascript is added to the plugin ‘snippets’
rather than in the functions.php file as I find this useful.Kindest
MickJuly 14, 2022 at 12:24 pm #1358318Hi,
Thanks for the login, but it is not admin so I can see any of the theme settings or make any changes, please elevate to admin.Best regards,
MikeJuly 14, 2022 at 12:34 pm #1358321Sorry mike, my bad, just updated you to an admin now
July 14, 2022 at 5:35 pm #1358356Hi MIke
I figured out why.
I had the offset too low at 10% so it wasn’t kicking in.
So when i changed to 30% it worked.Kindest
MickJuly 14, 2022 at 8:21 pm #1358377Hi,
Glad to hear that you have this sorted out, and thanks for sharing your solution, unless there is anything else we can help with on this issue, shall we close this then?Best regards,
MikeJuly 15, 2022 at 10:16 am #1358439Yes you can close this ticket. Thanks again.
July 15, 2022 at 1:16 pm #1358485Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘Sticky header – possible to stop at a certain point’ is closed to new replies.