SFloatingFeature

Platform  

js

   │    Support  

Chromium supported

Firefox supported

Safari supported

Edge supported

Since  2.0.0

   │   

Olivier Bossel

   │   

beta

  Preview

  Import

  Install

  Interface

1. ref

   String

   Specify the reference HTMLElement from which to position the floating one. If not specified, will take the previous element in the DOM

2. position

   auto

   • top
   • right
   • bottom
   • left
   • top-start
   • top-end
   • right-start
   • right-end
   • bottom-start
   • bottom-end
   • left-start
   • left-end
   • auto

   String

   Specify the placement of your floating element. By default it will try to be placed as good as possible.

3. shift

   10

   Number

   Specify a space between the floating element and the viewport side to respect

4. offset

   Number

   Specify a space between the floating element and the reference one to respect

5. arrow

   true

   Boolean

   Specify if you want an arrow or not

6. arrowSize

   15

   Number

   Specify the size of the arrow in px

7. arrowPadding

   10

   Number

   Specify the padding of the arrow in px

  Related resource(s)

@floating-ui/dom

Floating UI for the web. Latest version: 1.2.3, last published: 12 hours ago. Start using @floating-ui/dom in your project by running `npm i @floating-ui/dom`. There are 373 other projects in the npm registry using @floating-ui/dom.

Check out more...