Enhance sticky-margin functionality and improve documentation

[douden]

Functionality added:

• Sticky margin elements now work for images within figures, figures without images, images outside figures and directives.
• Behaviour when scrolling can be set to full ("margin element appears when original element disappears above the header") or to partial ("margin element appears when original element reaches the header") and corresponding disappearing behavior.

[Tom-van-Woudenberg]

Looks good!

When applying a sticky-margin to this directive, I get a horizontal scrollbar (with trigger: full) during the flying animation and I don't see the actual animation:

::::{admonition} Uitwerking
:class: solution, dropdown, sticky-margin

In de $y$-richting kan de locatie gevonden worden ten opzichte van de rechter wand:

```{figure} ./toz_data/statisch_moment.svg
:align: center
:source: https://github.com/Structural-Mechanics-CEG/mechanics-figures-source/tree/main/TOZ_schuifspanningen
:number:
```

$$\bar y_{\rm{N.C.}} = \cfrac{S_{\bar y}}{A} = \cfrac{300 \cdot 12 \cdot \cfrac{300}{2}}{300 \cdot 12 + 300 \cdot 12} = 75 \, \rm{mm}$$

::::

Futhermore, the order in the sidebar is not correct anymore:

The figure on the right goes partially out of view earlier than the other figure, so it should show first in the sidebar, now when the second figure goes partially out of view it moves the other figure down.

[douden]

Looks good!

When applying a sticky-margin to this directive, I get a horizontal scrollbar (with trigger: full) during the flying animation and I don't see the actual animation:

::::{admonition} Uitwerking
:class: solution, dropdown, sticky-margin

In de $y$-richting kan de locatie gevonden worden ten opzichte van de rechter wand:

```{figure} ./toz_data/statisch_moment.svg
:align: center
:source: https://github.com/Structural-Mechanics-CEG/mechanics-figures-source/tree/main/TOZ_schuifspanningen
:number:

$$\bar y_{\rm{N.C.}} = \cfrac{S_{\bar y}}{A} = \cfrac{300 \cdot 12 \cdot \cfrac{300}{2}}{300 \cdot 12 + 300 \cdot 12} = 75 , \rm{mm}$$

::::

The scrollbar is a result of a too wide equation that cannot be truncated automatically. That is a restriction of MathJax.

The animation I did not get either, but without the class dropdown it did work as expected. In some cases the dropdown+sticky behavior causes breakdowns to happen, so I have added code that disables the sticky-margin class if the dropdown class is also present.

I also added this to the README.

Futhermore, the order in the sidebar is not correct anymore:

The figure on the right goes partially out of view earlier than the other figure, so it should show first in the sidebar, now when the second figure goes partially out of view it moves the other figure down.

In this case this behavior is as expected: when the full trigger is used, triggers are caused by the bottom of elements, in this case the captions, which align, so the order in which these elements will be added to the margin is then the DOM order, in this case from left to right. If the partial trigger is used, the triggers are caused by the top of elements, which in this case the top of the images do not align, so the first trigger is given by the right figure, which appears first in the margin. Then the left image appears in the margin, but because of the DOM order, it is inserted above the already present element. In some sense this also makes sense, as the numbering of the elements is based on the DOM/node order, and not on the visual order.

I have added a caution to the README to express this behavior.

[Tom-van-Woudenberg]

as the numbering of the elements is based on the DOM/node order

That's not the case. I made it such that the order is based on the order on the rendered page:
https://github.com/TeachBooks/Sphinx-Sticky-Margin/blob/main/src/sphinx_sticky_margin/assets/sticky-margin.js#L52

For 'partial' the priority of top and bottom should be swapped

[douden]

I changed the README and added the swap. Can you test and review?