I've come across an issue with how my embedded content shows on mobile, specifically iPhones. I have six pages with similar embedded codes, and from what I understand iPhones will only show the first embedded content that is viewed, no matter which page you are looking at. The content appears perfect on both desktop and Samsung mobile, so I'm wondering if there is any way around this issue with Apple.
For reference, this is the code from one of my pages:
<iframe id="iframe" src="https://www.disneytravelcenter.com/ec11bbed84/" style="width:100%;border:none;"></iframe> <script> window.onmessage = (e) => { if (e.data.hasOwnProperty("frameHeight")) { document.getElementById("iframe").style.height = `${e.data.frameHeight + 30}px`; } }; </script>
and the only difference between the codes is in the disney travel center link.