garand / sticky

jQuery Plugin for Sticky Objects
Other
3.3k stars 1.06k forks source link

Sticky JS does not work on Mobile #244

Closed pcabrera83 closed 6 years ago

pcabrera83 commented 7 years ago

Sticky JS does not work on iOS 10.2. I tested on Chrome and Safari and the sticky header does not follow when I scroll. It works fine on desktop.

Any ideas?

sid-engel commented 7 years ago

I had disabled mine on mobile devices, It worked out better that way. After fiddling with JS for an hour(because I suck at it), I finally got it to work.

https://gist.github.com/sid-engel/996c1fd5d18e1c711dc7551d97982fb1

It properly enables/disables it, upon page resize, and load... Unlike any other solution I had found.

ghost commented 6 years ago

I've managed to make it work on mobile with another jqueryplugin jquery.documentsize , to replace the windowHeight and documentHeight with respectively $.windowHeight() $.documentHeight() function from the plugin.

I'm quite a newbie at making jquery plugin so I deleted the part of the code provoking error in my browser (scrolbarwidth() was provoking error). maybe someone more experienced could write it more properly ;)

since then I've managed to make sticky.js work properly with safari and safari mobile.

I use the same plugin to make calculation of the bottomSpacing property of .sticky