search

leafo / sticky-kit

A jQuery plugin for creating smart sticky elements
http://leafo.net/sticky-kit
2.9k stars 517 forks source link

Sticky div appears/disappears when scroll down - Ipad only #213

Open hellodi opened 7 years ago

hellodi commented 7 years ago

Hello,

Sticky elements work perfectly, but I have a problem on my Ipad. The problem happens in Safari, Chrome, but also Firefox (so probably not a webkit issue?) :

When I scroll down => element becomes sticky. It dissapears during 1/2 seconds and comes back.

And if I scroll to quickly, it happens again. I need to wait (not scroll) to make it reappearing.

It dœsn't seem to happen when I scroll down slowly. But it's hard to describe, very strange behaviour.

I saw posts #31, #180 and #189, and I tryed many advices but nothing changes. And in my case there is no problem with desktop version.

Can't test with an other tablet than ipad, but do you think there is a "touch problem" ? I cannot identify the problem...

Thanks in advance for your help !

hellodi commented 7 years ago

I realize I have the same problem with the black navbar on your website http://leafo.net/sticky-kit/

kylercarlson commented 7 years ago

Having the same issue, except on the iPhone 6 as well (most likely other versions). Seems to only happen when the address bar is appearing/disappearing and stickykit doesn't know how to handle that. When initially scrolling down the page the sticky nav will disappear as the address bar removes itself, and only reappear after coming to a complete stop. Then, scrolling down works fine. However, scrolling back up (which starts to reveal the address bar), the nav bar disappears and reappears as described above.

adam-jones-net commented 7 years ago

Did anyone get a fix or workaround for this ?

kylercarlson commented 7 years ago

Nothing I could figure out, unfortunately.

NoLooseEnds commented 7 years ago

Ditto.

audifaxdev commented 7 years ago

Bump it up +1

theonlyriddle commented 7 years ago

Check out this page: https://stanko.github.io/ios-safari-scoll-position-fixed/

Applying the CSS styling fixed my problems.

As for it being the "correct" solution, I'm not sure, but it works!

hpm76 commented 7 years ago

@theonlyriddle would you kindly share an implementation example? I am totally unable to make it work. Thank you in advance!

nternetinspired commented 7 years ago

This is not a sticky-kit issue per se, more a feature of iOS 9+ when it encounters fixed elements. Check out my solution on SO: http://stackoverflow.com/a/43188105/3375005

gzzhengbingyi commented 7 years ago

@nternetinspired thank you, It really works

chrisdemetriad commented 7 years ago

@nternetinspired That worked for me, cheers.

ro0t commented 5 years ago

@theonlyriddle I used the same solution and it fixed the sticky flickering issue on Safari for me!