我正在尝试将我们的页面嵌入客户网站上,它在浏览器中效果很好,我们的媒体查询做得很好,但是当在IDEVICE上的Ifarme内部时,页面没有响应性的行为,并以最大的媒体查询大小(> 870px宽)显示,并且看起来很小...
知道为什么这个ahppens或如何修复它?
我们以困难的方式学习了它。
iframe内部,
- 媒体查询不知道父窗口屏幕大小
- 在某些浏览器中,iframe实际高度/宽度将超过父页面中显示的CSS宽度/高度
简而言之,媒体查询与iframes并未完全兼容。
我们通过JavaScript实现自己的媒体查询。
总而言之,就像下面一样,
- 父页面加载iframe [在我们的情况下,用户单击链接后的弹出窗口]
- iframe设置了onmessage事件侦听器
- 父页面启动邮政iframe
- iframe接收父窗口宽度,直属页面的高度和任何其他必要的信息
- 手动通过JavaScript手动重新调整布局
希望这会有所帮助。