| 1 | ### Examples
|
| 2 |
|
| 3 | It's our goal to create a wide variety of example of how Tether
|
| 4 | can be used. Here's what we have so far, please send a PR with
|
| 5 | any examples you might create.
|
| 6 |
|
| 7 | #### Beginner
|
| 8 |
|
| 9 | - [simple](../../examples/simple): A simple example to get you started
|
| 10 | - [out-of-bounds](../../examples/out-of-bounds): How to hide the element when it would
|
| 11 | otherwise be offscreen
|
| 12 | - [pin](../../examples/pin): How to pin the element so it never goes offscreen
|
| 13 | - [enable-disable](../../examples/enable-disable): How to enable and disable the Tether
|
| 14 | in JavaScript
|
| 15 |
|
| 16 | #### Advanced
|
| 17 |
|
| 18 | - [content-visible](../../examples/content-visible): Demonstrates using the `'visible'`
|
| 19 | `targetModifier` to align an element with the visible portion of another.
|
| 20 | - [dolls](../../examples/dolls): A performance test to show several dozen elements,
|
| 21 | each tethered to the previous. Try dragging the top left tether.
|
| 22 | - [element-scroll](../../examples/element-scroll): Demonstrates using the `'scroll-handle'`
|
| 23 | `targetModifier` to align an element with the scrollbar of an element.
|
| 24 | - [scroll](../../examples/scroll): Demonstrates using the `'scroll-handle'` `targetModifier`
|
| 25 | to align an element with the body's scroll handle.
|
| 26 | - [viewport](../../examples/viewport): Demonstrates aligning an element with the
|
| 27 | viewport by using the `'visible'` `targetModifier` when tethered to the body.
|