Test 1

I should stick to the top and bottom of #foo1. I'm not a child of any #foo's.

Go to Sticky Docs

#foo1

#foo2

Test 2

I should stick to the top and bottom of #foo2.
I'm also a child of #foo2

Go to Sticky Docs

#foo3

#foo4

Test 3

I should stick to the top of #foo4 and the top of #foo6.
I'm a child of #foo4

Go to Sticky Docs

#foo5

#foo6

#foo7

Test 4

I should stick to the top of #foo6 and the bottom of #foo8. I'm a child of #foo7.

Go to Sticky Docs

#foo8

#foo9

#foo10

Test 5

I should stick to the top of #foo10 and the bottom of #foo11. I should be stick to the window bottom with a bottom margin of 1em (default bottom margin).

Go to Sticky Docs

#foo11

#bar1

Test 6

I should stick to the top of #bar2 and the bottom of #bar3.

Bar containers does not have fixed height, but i should be anchored correctly.

Go to Sticky Docs

Lorem Ipsum

#bar2

Lorem

#bar3

Lorem

Ipsum

Dolor

#bar4

Lorem

Ipsum

#foo13

I'm big to force scroolbar

#foo12

Test 7

I should stick to the top of #foo12. I should be stick until window end because only data-top-anchor is set.

Go to Sticky Docs

#foo13

#foo14

#foo15

I'm big to force scroolbar

Test 8

I should stick to the top and bottom of #foo3.
I'm not the child of any of you #foo's.
When I'm not stuck I jump to the top because I'm not a child of the top anchor, is this my normal behavior?

Go to Sticky Docs