The wait is over! Starting today with Draggable Popups & Floating Groups your users can now move, stack and position your pop ups and floating groups to their liking! No more being locked into one specific spot or tailoring your design around rigid pop ups.
Here are a few of the enhancements for your existing pop ups and floating groups you can find by installing this plugin.
1. They can now be moved. Drag any popup or floating group around the screen by its header, resize it, minimize it, expand it to fullscreen. They behave like real desktop windows instead of static boxes locked in place.
2. You can interact with multiple native popups open at the same time. Bubble normally lets one popup take over the screen. With this, you can open a customer card, a shipping panel, and a notes window all at once. Each is draggable, resizable, and stacked with click-to-focus.
3. You can interact with the page behind a popup without closing it. Native popups lock everything underneath. This makes the backdrop click-through, so your users can keep scrolling, clicking, and working on the page while popups float above it.
And it works with the popups and floating groups you already built. Add one ID attribute, no rebuilding.
First 5 commenters get it free!
Just drop a comment to claim.
Links
What it does
Works with popups AND floating groups. Whether you built something as a popup or a floating group, add the ID attribute and it gets the same window treatment. One plugin, both element types.
Real desktop-window feel. Drag by the header, resize from the corner or edge, minimize to just the header, expand to fullscreen. Click any window to bring it to the front. Behaves like a window on your computer, not a static modal.
Nine position presets. Set where each window opens via its ID Attribute suffix: Center, four corners, Left/Right Drawer, Bottom Sheet, or Fullscreen. Perfect for side references, mobile-style sheets, and full takeovers.
Non-modal mode. Make the backdrop click-through so users can keep working on the page (and open more windows) while one is open. This is the big one. Native popups lock the page, these don’t.
Smart docking. Drag a docked drawer’s header to detach it into a free-floating window. Double-click any header to snap it back to its preset.
Four header styles. Standard, macOS (traffic lights), Windows, or Terminal (neon-green monospace) to match your app’s look.
How it works
- Drop one plugin element on your page (or in a reusable header)
- Set any popup or floating group’s ID Attribute to start with
draggable-popup - That’s it. It gets enhanced automatically when it opens
Add a position suffix like draggable-popup-drawer-right or draggable-popup-bottom-sheet to control where it lands. The suffix also becomes the window title in Title Case, so draggable-popup-edit-customer shows as “Edit Customer.”
FAQ
Does it work with Bubble’s new responsive engine?
Yes, fully compatible.
Does it work on mobile?
Yes, with touch support for drag and resize. For phones, the Bottom Sheet and Fullscreen presets feel most natural.
Do I have to rebuild my popups?
No. Keep your existing popups, floating groups, content, and workflows exactly as they are. Just add the ID attribute. The plugin adds window chrome on top, it never replaces Bubble’s native lifecycle.
Can I open the same popup multiple times at once?
No. Because this enhances native Bubble elements, you can have one instance of each popup or floating group open at a time. To show several at once (like three customer cards), use several distinct elements, not copies of the same one.
How does closing work?
The close button fires a popup_close_requested event with the popup’s ID. Wire it to a Hide popup action, the same way you’d close any popup in Bubble, so the internal state stays in sync. Standard Bubble practice.
I have a question or found a bug. How do I reach you?
Leave a comment on this thread or reach out directly and I’ll get back to you fast.
Let me know what you think and what you’d like to see added next!

