Popups - bring to front / back / z-index problem

In reference to a small but annoying Bubble problem that I haven’t seen solved yet, where creating multiple popups can sometimes leave one appearing behind another one thanks to Bubble leaving out a way to control the z-index of the objects in the editor…

I found a workaround, completely by accident. If you have a popup appearing behind another popup, use the “Replace by another type” option to convert the hidden popup into a regular Group, then use the same option again to convert it back into a Popup again. Basically the logic is the most recently created popup will appear on top.

Enjoy!

16 Likes

This is genius man!

3 Likes

@richardosborne14 Where is the “Replace by another type” option specified? Are you just referring to clicking “Replace” on the Element editor, choosing Group, then “Replace” on the group and choosing Popup?

I’ve got a similar issue where I’d like for a popup triggered by clicking an element within a GroupFocus to display in front of the GroupFocus, but it does not. The GroupFocus is still in front of the popup (because of the z-index values) I tried the “Replace” suggestion as I interpreted it (which may have been incorrect) and unfortunately, it didn’t solve the problem.

3 Likes

This is perfect - Thanks for sharing

1 Like

You sir are a Legend!! I was struggling with this for half a day! None of the other solution worked.

1 Like

Actually you could change it directly to the same element type, without to use regular group type as a transition one. Just click on “Replace” , and if your problem is with a Popup element, just select to replace by a Popup element. it should work.

Best.

1 Like

You solved it - Bam!!!

1 Like

I had same problem with z-index of repeating elements. I deleted and re-inserted the repeating element, and it then had the top z index