Question

我们需要iframe，所以合作伙伴可以添加网址，我们可以控制显示的内容，而无需拥有网站代码。

如果不是iframe，看起来还不错。

但是使用iframe这是一个问题 - 窗口高度总是大于宽度。各种方法只是认为它的肖像。据我所知，heihgth是有多少内容，iframe没有卷轴。所以我的代码的iframe就像浏览器窗口，而不是父真实的浏览器窗口。

有各种各样的问题，但我仍然无法找到可行的解决方案。

更新

我发现如何使它不会超过高度 - 在窗口加载时，取窗口高度并将高度设置为div并溢出：滚动。因此整个窗口不会变得更高，所以iframe不会那么高。在加载窗口高度是初始iframe高度。仍然没有管理正确检测方向，因为现在由于某种原因，当纵向宽度仍然高于高度时，至少是960，至少是javascript看到的，但实际上它不会越过边界，这是768px。 / p>

现在试图找出谁让它有960px。然后去了：

function test2() {
        ?>

            <iframe src="" width="100%" height="100%"></iframe>

        <?php 
    }

这是100％宽度的空内容，为什么它是960px？不仅对于ipad，而且使用chrome仿真，我也看到它用于其他流行的移动设备。

因此，如果高度可以说是500，而且是960，那么它认为它的触地得分。但是在真正的ipad中没有960px宽度，它有768.即使javascript检测到960也不会更宽。这怎么可能？

更新

要检测我使用的是什么：

$(window).load(function(){  
   var width = $(this).width();
});

它获得更宽的屏幕宽度。也许iframe更宽并且具有水平滚动，但是iPad不会绘制滚动但是可以在父页面保持相同位置时水平移动它。

但只是检查了测试页面iframe - iPad不允许水平滚动并且页面适合iframe但仍然检测窗口宽度964px，而它应该是768

另外在测试页面中，iframe在div中，div的样式宽度为：768px！important; 和iframe的样式宽度：768px！important;

仍然iPad显示宽度964：）

更新

目前以hacky方式在合作伙伴页面上解决：最初的一个内部div我制作css宽度：300px，然后我得到了良好的窗口widht。然后因为我想要宽85％，我将寡妇宽度* 0.85加倍并将其设置为我希望更宽的那个div。早些时候我试图用css widht实现同样的目标：85％导致变得比屏幕宽。这仍然没有意义，但有效。

Answer 1

在父容器上使用此css：

height: 500px !important; 
width: 900px !important; 
overflow: auto !important; 
-webkit-overflow-scrolling:touch !important;

在窗口调整大小时（或方向更改时）检测iPad iframe中的方向

1 个答案: