Trust us, managing poppers can be a pain, we have learned it the hard way!
For this reason we have created Popper.js, your new best friend.
Popper.js is just ~6KB minified and gzipped, zero dependencies.
Its code base is in ES6 and is automatically tested against several browsers.
If this is not enough, it plays super nicely with
React, AngularJS and more!
We know, every popper has its own story. You must be able to fully customize
its behavior with ease. We have prepared a set of awesome options to satisfy your needs!
But they will never be enough, for this reason, Popper.js supports plugins (we call them "Modifiers")
You decide where the popper will stay, choose between the four sides of your reference element and shift it on the start or at the end of it.
We don't want your poppers to get lost. Give them some boundaries to make sure they will stay within them.
What if your popper hits walls? Will it act like a ghost, passing through it, or will it change side of its reference element? It's up to you.
Poppers have arrows, usually.
We take care of them making sure they stay in the right place: between popper
and reference element.
We automatically detect when your popper should be absolutely positioned or fixed. Don't worry about that!
No lag, period. Each position update takes almost no time to refresh your poppers. No compromises.
When you need surgical precision about the position of your popper, set an offset to it to shift it by the given amount of pixels.
Our plugin system allows you to add any kind of feature to Popper.js.
Most of the built-in behaviors are written as modifiers!
Looking for some real life examples of UI Kits, Dashboards and Design Systems that are implementing Popper.js? Try these hand picked Free & Premium products!
Visit our GitHub page to know how to get Popper.js and to learn more about it.