1

我正在使用 Asp.net mvc (w/html5) 制作 Web 应用程序。以下是我的应用程序原型布局计划：

在此处输入图像描述

如您所见，有 4 个不同的部分：

  1. 可伸缩侧边菜单（停靠在左侧）：这是一个侧边菜单，允许用户单击按钮并将其滑出视图。它将可以在其区域内使用滚动条滚动。
  2. 标题栏（停靠在顶部）：带有几个停靠在顶部的按钮的简单部分。
  3. 内容区域（拉伸以适应可用空间）：这将显示用户关注的内容。这将是用户滚动浏览器窗口时唯一滚动的区域
  4. 按钮栏（停靠底部）：应用程序的部分按住按钮。

所以我真正的问题是你如何设置一个要停靠的区域，以便它设置为始终显示在该区域中，即使滚动窗口也是如此（例如右侧的 facebook 广告栏或他们的聊天朋友列表） . 如果内容区域比浏览器窗口长而不是用户向下滚动浏览器窗口时（或者如果我们需要实现一个自定义的可滚动窗口来处理它自己在应用程序中的滚动），他们将向下滚动内容区域，但所有其他区域将保持停靠在视图中。你如何做到这一点？现在很多网站似乎都在这样做（facebook、twitter、windows azure 等）。任何示例将不胜感激。

谢谢

4

3 回答 3

0

Web 的好处是您可以检查（使用 Firebug 或其他工具）其他站点以查看它们是如何构建它们的。

也就是说，如果你想要一个粘性区域，我推荐StickyFloat，一个很好用的 jQuery 插件。

于 2012-07-23T21:43:47.977 回答
0

CSS 方式是将元素position设置为fixed

这个页面有一个例子：http ://davidwalsh.name/dw-content/css-fixed-position.php看或右上角的黄色便签。这是该元素的相关 CSS

.element {
    position: fixed;
    top: 2%;
    right: 2%;
}
于 2012-07-23T21:45:58.160 回答
0

我使用了这个很棒的 jQuery 插件，它提供了你想要的东西等等。

UI 布局插件

于 2014-05-22T10:58:11.117 回答