Page jumps on scroll glitch

Support
#1

Hi guys,

I’m working on a site where I created a simple sticky header. When I start scrolling down, the body sort of “jumps” to the top behind the sticky header. I made a video to demonstrate: https://drive.google.com/file/d/1cOXW6gQhFUn-jySBLcbFFiYUY5BMgoGc/view?usp=sharing

I did find a workaround in the forums (by adding a 2nd bar), but that’s the ugly way to fix it imho.

Thanks!

#2

I have the same problem and looking for solution. I tried switching from Relative to Absolute under Bar > Setup but then the title of the page in the content area move all the way up and some part hides behind the nav bar in both mobile and desktop.


Apart from Content area, my header also shakes in both mobile and desktop.

#3

Hi @bartvanoers,

Thank you for writing in, please duplicate your bar, the first bar would be static, turn off the Sticky Bar option of the first bar. The second bar would be the Sticky Bar and Hidden Initially, that way the bar will have a smooth transition.



@rajivsarna,

Please do the same.

Hope it helps,
Cheers!

#4

Thanks.

Is that really the only way to fix it?

#5

Hello @bartvanoers,

If you do not want to hide the bar initially, then please set it to absolute so that the jump will no longer display.

Hope this helps. Kindly let us know.

#6

Hi @friech, No its not working and it’s giving more problem. By implementing what you suggested, my background image under the header moved up to positon 0,0. Header is on top of the background image.
Also my background colour for header is rgba(32, 37, 41, 0.9), so when I scroll up, I see 2 headers criss-crossing each other.

#7

Hello @rajivsarna,

You have two custom headers “Global” and “Home”. Which header you are referring to so that we can take a closer look?

Thanks.

#8

Top Header (Home Page Header) i’m using for Home Page because I have another bar at the bottom of my header with big background image that I don’t want to use it in other pages.

Bottom Header (Other Page Header) i’m using for other pages without the bottom bar that has image.

Problem is with both the headers - Home and Global.

  1. The background image problem is on the home that has separate bar for image under my Navigation Bar.
  2. 2 headers being criss-crossing each other are on both Home and Other Pages.

#9

Hello Rajiv,

This thread is getting a bit longer and more importantly has been started by a different user. To avoid any confusion and slow response time, I request you to please create a new ticket and share the message in the same.

Thanks for understanding.

#10

@friech While I think that’s a way to work around it, I set the offset of the 2nd bar a little higher. That way the bars don’t “overlap” visually. It’s good enough for now. Thanks.

#11

Glad that you managed to handle the case.

#12

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.