Question

我正在开发一个包含水平分割的框架集的网页;左侧的侧边栏，用于菜单和内容区域。

<!DOCTYPE html>
<html>
<head>
    <title>Frameset Test</title>
</head>

<frameset border="0" cols="100,*">
    <frame id="SideMenu" name="SideMenu" src="SideMenu.html" scrolling="no" />
    <frame id="MainPage" name="MainPage" src="LongPageContent.html" scrolling="auto" />
</frameset>
</html>

在桌面浏览器（包括Safari）中，框架集设置为视口大小，并在MainPage框架中显示长页面内容的滚动条。在iOS上的Safari中，框架集扩展到与MainPage框架中的内容相同的大小，延伸到可见视口之外。

我想要前一种行为，以便页面大小保持与视口相同，而不管MainPage中的内容如何。我已经摆弄了视口元标记，但调整视口不会修改框架集行为。

我知道Apple的iOS指南建议避免使用框架集，因为滚动更令人困惑（需要在框架中双指滚动），但放弃框架并不是一个很好的选择。

Answer 1

Safari Safari内容指南指出这是正常行为。框架将展开包含您的内容，您将无法滚动。

我很抱歉，但你将不得不放弃框架。

您可以将Nav Nav编码到每个页面（这很糟糕），或者将某些内容放在PHP中，将SideMenu的内容动态加载到列中。

Answer 2

AFAIK，<frame>和<iframe>双指滚动行为已被放弃。从iOS 4.X开始，元素现在正在调整其内容的大小。

由于position:fixed;在iOS上不起作用，因此您无法阻止您的SideMenu框架以让其余部分滚动。

这个库似乎提供了一个有趣的解决方法：http://cubiq.org/iscroll

iOS Safari扩展了比视口大的框架集

2 个答案: