leafo/sticky-kit

On refresh, does not activate if not Div

Opened this issue · 2 comments

danielnr87 commented

I've noticed a strange bug where the sticky element doesn't activate if class not on a div (an <article> in my case). This only seems to affect it if the document is reloaded half way down. If the page is loaded at the very top then it is fine. Only on reload. Changed <article> to a <div> and it works fine on reload.

ankedsgn commented

+1,
My element needs to be sticky inside the <body>, and has the exact same problem

Recreate

  • Make an element .my-sticky-thing, that is a direct descendant of the <body>
  • $('.my-sticky-thing').stick_in_parent();
  • In chrome, open your page. Works normally.
  • In chrome, scroll your page down, and refresh
  • Element is now not sticky, (in my case appears on two spots) and has unpredictable positioning behaviour

What I expected

That after a reload halfway the page, the item would stock in the parent as before

Bonus check

On the same page we have another sticky element, in a parent div. That element behaves completely as expected.

Tried

Setting a class on the <body> and specifically defining that class as a parent didn't fix it unfortunately.

(By the way, Thank you for this script, we use it a lot and it's really handy and easy to set up!)

carasmo commented

I haven't had this issue. I think it's because I'm using https://necolas.github.io/normalize.css/7.0.0/normalize.css which turns article, nav, section, etc., into blocks.