Hi everyone 
Just released Float, now live on the Elements store. Quick framing before the feature list: Float is the contextual-content layer for your Elements pages. Tooltips, popovers, hover previews, help bubbles, confirmation prompts, action menus, annotations — anything that should appear next to a trigger and disappear when you’re done with it. One component, three interaction modes, smart auto-positioning, and full theme integration.
A bullet list can only convey so much — do yourself a favour and check the live demo linked below before forming an opinion. That’s where Float actually shows what it can do.
Smart positioning, no math required
Where most popover plugins make you pick a side and live with whatever happens, Float adapts:
• Four sides + alignment — top, bottom, left, right with start/center/end
• Auto-positioning — Float flips to the opposite side when there isn’t room near a viewport edge, and shifts along the cross axis to stay fully in view
• The caret follows the trigger — even after the popover has shifted to fit, the small arrow keeps pointing at the actual trigger center, not the popover center
Three interaction modes
Pick the right interaction for the use case:
• Click — toggle the Float open/closed. Persistent until dismissed (click outside, ESC, trigger again, or mouse leave — each dismissal independently togglable).
• Hover — opens on mouseenter, closes on mouseleave. Configurable Show Delay and Hide Delay. Hovering the popover keeps it open, so users can comfortably move from trigger into the content.
• Both — hover shows a preview, click locks it open until dismissed. While locked, hovering another trigger re-anchors the Float without unlocking — perfect for grids of cards where you want the popover to follow the cursor while staying open.
Touch Fallback is on by default for Hover and Both modes: on touch devices the Float automatically behaves like Click, so the same configuration works on desktop and mobile without extra fiddling.
Visible until dismiss, or auto-hide on a timer
For toasts, snackbars, and self-dismissing notifications:
• Visible Until Dismiss — stays open until manually closed
• Hide After Timeout — auto-closes after N milliseconds with a configurable delay
• Pause on Hover — when timeout is on, hovering the popover pauses the timer; mouseleave resumes. Readers get the time they need.
Internal or external triggers
You don’t have to wrap your trigger inside the Float component if it doesn’t fit your structure:
• Dropzone mode — drop the trigger element (button, icon, image, anything) right inside the Float. The standard case.
• Class mode — attach Float to any element on the page via a CSS class. Multiple elements can share the same class and all open the same Float, anchored to whichever was triggered. The popover follows the actual trigger via fixed positioning, so it works even when the trigger is deep in your DOM.
• External Control — add a class to any element anywhere on the page (a footer “Need help?” link, a navbar shortcut, a CTA button) and clicking it opens the same Float, which stays anchored to its main trigger. The visual location of the Float doesn’t follow the external opener — it sticks to the configured anchor — so you get one popover with multiple entry points across the page.
This unlocks tooltips on words inside paragraphs, hotspots on images, navbar bell icons, footer help-shortcuts, and any other case where the trigger isn’t where the Float component sits.
Animation + theming
Six entry/exit animations to match your design language:
• Fade, Scale, Slide Up/Down/Left/Right with configurable duration
• Customizable caret with theme color, opacity, and scale — borders inherit from the popover for a unified outline, and the caret automatically stops at the start of the popover’s rounded corner so it never visually detaches from the body
• Sizing presets — auto-fit content, match the trigger’s width or height (caption-style overlays, full-cell image grids), or pick a theme spacing token
• Full theme integration — background, border (color + opacity + width), padding, border radius, shadow. Every visual property is responsive across breakpoints.
Perfect for
• Tooltips on help icons, info buttons, technical labels (the everyday case)
• Help popovers on form fields with longer explanations than a tooltip can carry
• Profile / preview cards on hover (avatar, username, hashtag, link)
• Quick action menus from a kebab ••• icon
• Auto-hiding success toasts after a save / submit
• Image annotations and hotspots — multiple Floats, each with unique content, anchored to specific markers
• Confirmation prompts for destructive actions (a lightweight alternative to modals)
• Notification panels from a bell icon in the navbar
Links
Live demo: Float for Elements - RW Pro Space
Get Float: Elements Store
Happy to answer questions or take feedback here. Thanks!
— Massimo
component and very useful! perfect for optimizing space
- however, it didn’t stop me from purchasing the component. Looking forward to putting it to use. 
.
see it all the time on other websites…
