robbestad/react-stickydiv

A few issues, and a suggested new way of doing things

Closed this issue · 3 comments

z5h commented

Hi. I was looking for a stickydiv react implementation and started using yours. In the process of fixing some issues, and adjusting for my needs, I've largely rewritten in. It can be found here. https://gist.github.com/z5h/d95304d8d8e1fb6d0619

I'm sharing because I think it does some things better (at least for me) and don't want to create another project. If you think this is useful, take it, or parts of it. If it diverges too greatly from your plans, let me know and I'll create my own project.

Anyway, the way it works is as such:

  1. Use some public domain code on quirksmode.org for finding position relative to viewport.
  2. Run this code on scroll events (not on interval ticks).
  3. If the element in question has an x >= 0, it renders as usual. Else:
  4. The element becomes visibility:hidden. (so it continues to take up space and there is no jumpiness, as there currently is with stickydiv). A duplicate of the element is rendered at 0, with a width taken from the hidden original.
robbestad commented

Thanks a lot for this! I'm going to look over your gist during the weekend and merge it with my code.

robbestad commented

Implemented! I'd like to add an AUTHORS file and add you to it. Let me know if that's OK.

z5h commented

Sure, add me! Much appreciated.
Next time I have a fix/feature I'll make a pull request.