Tether

A client-side library to make absolutely positioned elements attach to elements in the page efficiently.

This module only provides static assets. Please go to http://tether.io/docs/welcome/ for full info.

Tether is a small, focused JavaScript library for defining and managing the position of user interface (UI) elements in relation to one another on a web page. It is a tool for web developers building features that require certain UI elements to be precisely positioned based on the location of another UI element.

There are often situations in UI development where elements need to be attached to other elements, but placing them right next to each other in the DOM tree can be problematic based on the context. For example, what happens if the element we’re attaching other elements to is fixed to the center of the screen? Or what if the element is inside a scrollable container? How can we prevent the attached element from being clipped as it disappears from view while a user is scrolling? Tether can solve all of these problems and more.

Some common UI elements that have been built with Tether are tooltips, select menus, dropdown menus, and guided tours. Tether is flexible and can be used to solve all kinds of interesting problems; it ensures UI elements stay where they need to be, based on the various user interactions (click, scroll, etc) and layout contexts (fixed positioning, inside scrollable containers, etc).

Please have a look at the documentation for a more detailed explanation of why you might need Tether for your next project.