Question

我想在页面左侧有一个垂直拆分视图栏，它保持固定，就像我所拥有的data-position="fixed"标题栏一样。

就像在this example中一样（编辑：此链接现已断开），但左边的列表也已修复，标记与标题一起。

我想过尝试将其插入标题中以“继承”固定定位。不确定这是否有效。

以下是我的样式表的内容。

.content-right {
    float: right;
    width: 75%;
}
.content-left {
    width: 23%; /* Not 25%: I am not using padding */
}

.content-right div在HTML中排在第一位。

我还想要的是，如果固定的标题被隐藏（通过点击），这个栏会优雅地向上滑动，但这并不是那么重要（我现在可以强制点击隐藏）。

Answer 1

没有任何开箱即用的东西。

您可以使用我正在开发中的multiview plugin。我现在正在完成导航和面板历史记录。另外还可以修复平板电脑/智能手机视图如果你不介意那里仍然存在的bug现在可以使用（请在Github上发布问题）。

以下是我正在使用的一个示例页面：sample-overthrow

此视图会锁定屏幕并使用overthrow分别滚动每个面板。除了将 data-scrollmode =“overthrow”添加到包装页面之外，无需配置任何内容。检查HTML以查看其设置方式。还要注意，这是我第一次尝试整合Overthrow，但它还不是很顺畅。

其中整个页面像常规JQM页面一样滚动。这是默认行为。

您可以并排使用1/2/3面板（需要将它们标记为“menu”，“mid”和“main”，我正在从代码中删除“fullwidth” - 在以前的版本中使用），所以如果您只想在侧面使用“导航栏/侧边栏”，只需使用宽度为... 50px的菜单并将工具栏放在那里。主面板应自动缩放以填充屏幕。我也开始使用屈服模式，允许滑入/滑出工具栏。还没有完成这个。

Answer 2

我想出的解决方案是左侧使用固定div，右侧是自然滚动的实际“页面”。

由于我的左侧div离开了页面，因此在桌面浏览器上，滚动条也会离开页面。这需要处理。但是，在iOS5上，使用-webkit-overflow-scrolling: touch固定div滚动功能完美！

jQuery Mobile：修复了带有固定标题的侧边栏

2 个答案: