如何使用 javascript 从内部更改父 iframe 大小？

Question

we have a ReactJs code that will run as an iframe in a website the problem is that we have lots of clients that set iframe height 700px as default and we can not tell all of them to change it and we don't have access to the iframes. and this will make our project scrollable. we want to make it full size without scroll from inside.

<iframe width="100%" height="700" src="url" frameborder="0" id="myIframe" scrolling="no"></iframe>

Answer 1

我想您应该将宽度和高度的单位从%更改为与所有设备兼容的视口，例如：将宽度设置为100vw ，这将设置 iframe 的宽度以覆盖整个视口宽度，因此宽度将是动态的，高度设置也是如此将它设置为100vh还可以添加样式，删除该 iframe 的宽度和高度属性，并添加与以下内容相同的内联样式，

<iframe style="width: 100vw; height:100vh" src="url" frameborder="0" id="myIframe" scrolling="no"></iframe>