Sticky header stuttering on scroll > need it fixed (in pro)

Support
#1

Hi guys, what im trying to accomplish is the following…

I currently heave an sticky header and when i scroll i feel there is a litle jittery at the top… it doesnt scroll fluently ( tried multiple browsers)
I want it to be sticky and static, without any resizing nor jittering… (hard to explain) hope you understand what i mean…
These are the settings i got now:

as you see i tried putitng offset on -1, (that helped a bit but didnt remove the issue)
shrink on 0 currently, tried 1 aswell… still stuttering at scroll.

Thanks in advance guys! (ps yes i looked and searched in the other topics, but couldn’t find anything)

Sticky headers stuttering when scrolling
#2

Hi @creativeG,

Thanks for reaching out.

From that setting, please change the initial position from Relative to Absolute. And make the trigger offset to 0. Let me know :slight_smile:

Thanks!

#3

that made it even worse… it now hides then appears again on scroll… if u scroll slowly from top.

And i don’t think absolute is the solution… because i have another bar under the menu for Breadcrumps… those are hidden now. :confused:
with ‘relative’ it shows ok.

I don;'t think what im asking is hard?
I just want the header to be sticky and not to move anywhere when scrolling down… no effects ,no resizing nothing…

#4

Hi @creativeG,

In that case, please deactivate your smooth scroll plugin and test it again. It’s not hard, but I’m not really sure what triggers the issue since there are multiple effects. And please provide your admin login credentials in a secure note for further checking. I could only troubleshoot it in the front but not the actual setting.

Thanks!

#5

yea smooth scroll is not the issue, i disabled it, didnt help… ill add temp creds to the page. please if you change settings, let me know WHAT is changed, and where… so i know it for future referenses…

#6

Hey @creativeG,

The issue happens when the sticky bar’s scripts are triggered resetting the bars positions. The sticky bar script allows for the bars to be positioned properly.

This is delayed effect is a known issue. Regretfully, there currently no simple fix for this. We’re sorry but we need to wait for an updated.

If this is important to you, you will need to use the Classic Header. This will limit your design capability though.

Thank you for understanding.

#7

aha, so the issue is familiar to you guys? this has been like this from the start tho :confused: even with the old versions,
how come there is still no fix for it?

It just doesn’t look nice at live production when finishing the stage site.

Hope there is some kind of a way around without the classic header.
Can we prioritize this for a next schedule update pushtrhough? Would be amazing.

#8

hm not entirely true… if you do it manually to scroll throught the bar… it still inflicts the bar… let me try to capture it so you see what i mean.

I don’t think you understand exactly what i mean, sorry but its hard to explain lol

#9

There already is an improvement in this latest version. However, since it’s powered by Javascript, other scripts loading in your site like the Smooth Scroll plugin can delay its function.

I personally could not replicate this issue in my test site simply because there’s no other scripts running.

I understand the issue. Otherwise, I would not have provided details of where its coming.

#10

even with smooth scroll disabled its bad… doubt its the smooth scroll that causes it.

look i made a gif

#11

It does not behave like that when I investigate. I should have taken a screencast.

#12

look ive found a site thats using xtheme to, sticky header > exactly how i want it. no resizing no moving, its fixed as a sticky header.

#13

I’ve disabled the Smooth Scroll extension and the behavior has improved to almost no “stuttering” as expected. See secure note.

The site you’ve pointed out is using X. The same thing as Classic Header.

Please understand that there’s currently no way to fix this but to use the Classic Header or reduce the scripts running in your site especially scripts that modify the scroll behavior.

#15

oh yea i see it now… flawless … weird. :confused: i tried it on diffrent pc’s just to be sure… still have the stuttering. but as i see it on the video, its looks good. Im going to search deeper for the solution. thnx so far…

#16

The Smooth Scroll plugin includes a script that modifies the scroll behavior. As you can see in my screencast, I disabled it and it improved the issue. Even though the plugin comes from us, this will still require ample amounts of time to investigate.

My replies are not generic. I have spent time on troubleshooting this and have found where the issue is coming from.

I understand that you need a fix and you are frustrated. But, there’s nothing we could do in this case other than to disable the Smooth Scroll plugin and recommend that you reduce scripts (note that third party plugins can add scripts to your site and not just custom user scripts) or switch to the Classic Header.

Thanks.

#18

Hey Christian,

Can you try it now on your end with the Firefox browser?

It seems the problem is fixed when using chrome… but in firefox its acting real weird. could you try checking it once again.

Thanks!

#19

Hey @creativeG,

I am now continuing the investigation. I will update this reply with my findings.

Please do not reply if I have not added an update.

Thanks.

#20

Update: The issue is mostly because of scripts loaded in your site. I created a test page with Blank - No Container | Header No Footer page template and only a Gap element in the content so only the sticky bar script is loaded and to enable scrolling in the page and the result was, the issue does not happen. I’ll post my recordings in the secure note. They are currently being uploaded.

Thanks.

#21

Hmm… let me try and see if i can find that page. Did you try in in firefox to?

#22

Yes, I have tried in Firefox. Please kindly wait for the screen recording to see what I did and the result.

Thanks.