我必须在平板电脑和手机上显示的网页上显示第 3 方链接(跨域)。
第 3 方已决定显示模式窗口，在初始页面加载时垂直居中。
我遇到的问题是手机(尤其是 iOS 5 移动版 Safari)会自动调整 iframe 的大小以适应内容，导致模态窗口呈现在屏幕底部之外，因为它有很多很多像素高。
我已尽我所能使 iframe 以固定大小显示，但没有任何效果。
- 添加
height属性或样式被忽略，即使使用!important - 使用
-webkit-overflow-scrolling: touch;将 iframe 包装在div中似乎可行，但在这种情况下，仍然会导致 iframe 扩展，并且，因此，在屏幕外显示模态窗口。 - 添加
scrolling="no"允许 iframe 以固定大小显示，但我现在无法让 iframe 滚动。
我想知道是否有 iframe 的替代方案，或者我是否可以做些什么来让 iframe 以固定大小正确显示。
哦，我必须提一下，我不能简单地在新窗口/选项卡中打开第 3 方链接，因为这个网页被烘焙到我无法控制的应用程序中。
<!doctype html>
<html>
<head>
<title>Test</title>
<style>
iframe
{
height: 100px !important;
}
</style>
</head>
<body>
<iframe style="height:100px;" height="100" src="http://dump.mrslayer.com/test2.html"></iframe>
<script>
setTimeout( function( ) {
var iframe = document.getElementsByTagName( 'iframe' )[0];
iframe.style.height = "100px";
iframe.height = 100;
}, 1000 );
</script>
</body>
</html>
最佳答案
您可以使用 PHP，但这会打印与您的文档内联的整个文档内容。
<?php
echo file_get_contents("http://dump.mrslayer.com/test2.html");
?>
如果这是一个问题，您可以使用正则表达式或类似的东西删除 <body> 之前的所有内容标签和 </body> 之后在你有 file_get_contents() 之后标记.
您可以将此函数包含在 <div> 中，这应该更容易用 CSS 控制。这是我能想到的最简单的 iframe 替代品。
关于javascript - 允许 iframe 在移动设备上溢出，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17309543/