-
-
Hello,
I am using Tower theme.
Sometimes the sticky header may stop working.
I’m not sure about all of what may cause it, but I know at least one way to break it. You can reproduce it at your demo too:
https://preview.codeless.co/tower/default/
If you minimize and maximize the browser’s window with your mouse, or simply resize it a bit (make it either bigger or smaller), then it breaks and won’t appear.
Any fixes?
-
First of, you’ve posted a link to your home page. The correct link is this: https://support.codeless.co/?topic=suggest-us-features
(Edit: The link arrived correctly in the email notification, but the auto-embed cut the query string out.)
I will also leave a comment there, but this is not a “feature” that I want. I don’t want to suggest any features.
I am asking for a bug fix, because your demo has a bug. I’m asking it in the support center for the Tower theme – you don’t seem to have any other place for reporting bugs. Correct?
-
Hello and thanks for the prompt solution.
The above code didn’t work for me, but it was in the right direction. I wrote the following which worked, based on your code:
//const header = jQuery(‘#header’);
const header_wrapper = jQuery(‘.header_wrapper’);
const body = jQuery(document.body);window.onscroll = function () {
var top = window.scrollY;
if (top >= 120) {
body.addClass(‘sticky_header’);
header_wrapper.addClass(‘open’);
header_wrapper.css({“position”: “fixed”, “visibility”: “visible”});
}
else {
body.removeClass(‘sticky_header’);
header_wrapper.removeClass(‘open’);
header_wrapper.css({“position”: “absolute”, “visibility”: “visible”});
}
}
There are some issues that I’ll have to iron out such as:
1) The header_wrapper has an absolute position on my home page in order to appear over the Revolution slider, but a relative position on all the other pages in order to appear above the breadcrumbs. Therefore, I’ll have to write an action hook in PHP to enqueue two different JS scripts depending on whether it’s the homepage or not. Okay, consider that one as done.
2) The function seems to affect the mobile header as well and there’s a subtle movement there, but it’s very subtle to be a noticeable problem. Still, I’m looking forward to a theme update where this certainly won’t be an issue since you’ve already implemented mobile and desktop logic.
3) The animation speed of the sticky header when appearing and disappearing has been affected and it’s now faster. I would like to improve on that one. It’d help me if you could point me to the PHP and JS functions in the theme that handle the sticky header, so that I can see your original styling and mechanics.
I hope a more proper fix will be included in a future theme update so I can remove this code. Thank you.
-
The website is 2science.gr
I’ve pasted the entire code at pastebin, the PHP action + JS:
The main issue is #3 of the above issues, the animation speed. I’ve already dealt with #1.
-
You must be logged in to reply to this topic.