Add a Tether element to a custom parent element

Question

Is there a way to set a custom parent to which my target with Tether will be added?

By default, all anchor elements are attached to the body . I bind the dropdown element to the input inside the modal and due to problems with z-index. I need this dropdown to be added to the modal and not to the body . Does Tether have the ability to do this?

Answer 1

A few things to try ...

First, make sure you use the CSS that comes with Tether. Just adding CSS to my project has fixed overflow problems created by the element above the closing body tag.

In addition, when Tether works, it will add classes to elements that you can use to style things. From your documents:

Classes

the bound element is added to the element

target binding is added to the target

attached to a cable is added to both elements when the cable is not disconnected

the attached cable element - [left, right, upper, lower, middle, center] is added to both elements based on the attachment of the elements, if the element becomes detached (for example, if it is fixed), this class is deleted. The class reflects how the element is actually attached, so if the constraint changes the attachment, this change will be reflected in the class.

tied to a trophy - [left, right, top, bottom, middle, center] is added to both elements based on the target attachment. All specifications are the same as for attached items.

Constraint Related Classes

snapped borders , snapped-out borders - [side] is added both to the element and to the target when placing the element outside its limits.

tied to a cable , tied cable - [side] are added both to the element and to the target, when the restriction binds the element to the [side] container.