Collapse when hidden problem

Hi all!

I have an image that’s initially hidden, but I want to reserve space for it to animate its appearance later. Playing around “Collapse when hidden” option I found that though this option is not checked in my case, corresponding element in HTML DOM tree is still collapsed. Is this a bug or I’m missing something?

In this simple case it can be worked around by setting fixed width and height, but in my production case I use % width with aspect ratio applied, so this becomes a problem for such a scenario.

P.S.: BTW same problem exists for Text elements with “Fit height to content” checked.


Hi!

From what i understand, Bubble renders HTML only when a Bubble element is loaded. So hidden Bubble elements are not rendered in HTML.

If you need to reserve space while keeping the image loaded, try having a conditional (set the condition to whatever is supposed to originally hide the image) to resize the image’s height and width as small as u are comfortable with.

1 Like

Thank you for the reply.
I don’t know precise size as it’s set via % of a container width and scale factor, which fails to calculate height if image is initially hidden. Nothing actually prevents to do that as you don’t need an image itself in this case.
I do know how to work this around with conditions, workflows, a well as with CSS. The questions is what should be the expected behavior. Bubble documentation doesn’t cover this topic specifically, but from general description of “Collapse when hidden” option I’d expect for Image container div to have relevant non-zero size.

Yep when all else fails applying CSS is my go to solution since it’s also somewhat a native solution cause u can set style properties in a HTML element and easily apply an ID to elements.

This topic was automatically closed after 14 days. New replies are no longer allowed.