0

我正在将我的应用程序从 WPF 移植到 HTML/Javascript，并且在我的应用程序所需的布局方面遇到了问题。

此布局应占据整个可用屏幕。它实际上将被放入一个 jquery ui 选项卡中，因此从技术上讲，它不会是整个屏幕。我已经让这部分工作，但不是全部一起工作。

左侧将有一个自定义的滑动地图，我希望它在水平和垂直方向上占用尽可能多的空间。

右侧将在顶部和底部有一些过滤器，中间显示过滤器的结果。结果可能会很长，因此如果从 Web 服务器中提取了太多内容，则需要垂直滚动。

我需要帮助的是支持这一点的基本布局。任何帮助，将不胜感激。你可以在下面看到我的布局图。提前致谢！

需要布局

4

3 回答 3

0

在那个 div 中，添加style="max-width: 350px; overflow-y: scroll;"

于 2013-02-25T22:08:45.157 回答
0

首先，你需要这样的东西（它被称为流体 - 固定布局），这是一个你可以从动态驱动器http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-21-fixed -流体/。除了您需要“反转”边距和宽度（从左到右替换），因为该示例与您的布局相反。

其次，您需要将第二个 div (350x50) 放在页面底部。您可以做的一些事情是设置该 div 使其具有以下内容：

#small_box
{
    position: absolute;
    right: 0;
    bottom: 0;
    ...
}

上面的链接即使在 IE6+ 上也能正常工作

希望能帮助到你。

于 2013-02-25T22:10:40.767 回答
0

我刚刚决定使用相对定位和一点 javascript。花了几个小时寻找一个没有结果的优雅解决方案，一旦我决定使用 javascript，我只花了几分钟。像这样的事情在 WPF 中很容易做到，所以令人惊讶。我基本上只是附加到 window.onresize 事件并手动设置右侧垂直扩展滚动条的高度。无论如何感谢您的建议。

于 2013-02-26T18:48:00.260 回答