iOS 9 Safari: changing an element to fixed position while scrolling won't paint until scroll stops

Question

I\'ve been developing a site and taking advantage from the rather good jQuery Sticky Kit plugin. It operates by switching the position property to fixed

Answer 1

jQuery Sticky Kit and other similar plugins, even being well coded, are presenting this kind of behavior on iOS 9, and it is not the first time that something like this happens. The main point here is that Firefox Safari and Safari Mobile support the experimental position: sticky;, so did Google (Chromium) but, due to integration problems, has had to temporarily disable it, you can read more about it here. Having said that, my guess is that, very soon, position: sticky; will be part of the CSS specification and supported by all major browsers, thus I think the best approach to solve this issue is to use a polyfill instead of a plugin. Of course, a polyfill will not cover all the features and functionalities that these plugins offer. Nevertheless, in many situations, using a polyfill will do the work, as a robust and effective solution supported by all major browsers. In my opinion it is the way to go, for now. I personally use stickyfill although I am sure other polyfills in the wild will do the trick. All I can say is that, since I started using a polyfill instead of plugins, I have not had any browser compatibility issues.