Hi all,
I’m using an HTML embed of a video chat that uses iframes, and due to how bubble is set up, anytime the window size changes, the embed disappears. I contacted the video chat service provider and they said that is because bubble has an “on window.resize()” function that clears out iframe elements. Is there a way to disable this in bubble?
Thanks,
Henry
I’m not sure, try with meta tags header.
<meta name="viewport" content="width=device-width,user-scalable=no">
or
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
hm didnt seem to work. thanks for the suggestion though
Hi all, bumping this – anyone know how to disable bubble from clearing out all iframe elements on window resize? would really appreciate the help!
I’ve got the exact same question. Does anyone else know a workaround for this?
Or @hschreib - did you manage to find a solution?
I managed to fix my issue so posting just in case anyone comes across the same issue (basically my iFrame was disappearing any time the page was re-sized).
I needed to uncheck ‘Display as an iFrame’ and check ‘Stretch to fit content’. Now the iFrame reloads each time the page is resized but does display.
If you control the page you’re trying to embed this is a great solution I’ve been using https://github.com/davidjbradshaw/iframe-resizer
Basically, you’ll put one JS file in the parent page that contains the iFrame/HTML element, and one JS file in the child page that is being embedded. This JS will then make sure that the height of the iFrame works continuously.
To implement, I would recommend using JSDelivr with tags in this format:
On the child page:
<script src="https://cdn.jsdelivr.net/gh/davidjbradshaw/iframe-resizer@latest/js/iframeResizer.contentWindow.min.js"></script>
On the parent page:
<script src="https://cdn.jsdelivr.net/gh/davidjbradshaw/iframe-resizer@latest/js/iframeResizer.js"></script>
Good luck!