可滚动内部内容的可停靠DIV

我有一个应用程序可以在页面上有多个div。这些div的结构是这样的：可滚动内部内容的可停靠DIV

CSS

.DockableWindow 
{ 
    position: absolute; 
    left: 300px; 
    top: 150px; 
    width: 800px; 
    height: 600px; 
    border: 1px solid black; 
    background-color: White; 
    z-index: 999999; 
} 

.DockableWindowContent 
{ 
    position: absolute; 
    height: 87%; 
    width: auto; 
    margin: 0px 5px 0px 5px; 
    background-color: white; 
    overflow: auto; 
}

HTML

<div class='DockableWindow'> 
    <table> 
     <tr> 
      <td>button</td><td>button</td><td>button</td><td>button</td></tr> 
     <tr> 
      <td colspan='4'> 
       <div class='DockableWindowContent'>scrollable content goes in here</div></td></tr> 
    </table> 
</div>

我使用jQuery设置outerdiv可拖动和可调整大小。可调整大小的标记也设置为调整包含可滚动内容的内部div。

这一切工作正常，窗口可以拖动和重新调整大小没有问题。

但是，我需要能够击中工具栏上的按钮，并使所有当前打开的窗口以水平或垂直方式停靠在页面上。虽然窗口将停靠，但如果用户选择，它们仍然可以调整大小并移动。

我已经尝试了各种方式，但我不能得到内部股利正确调整大小，当外部div的大小和位置。

我试着调整使用javascript和CSS，但无论我尝试内部div总是悬垂在外部div的底部。我也尝试使用JQuery来触发resize事件来获取内部div来调整大小，但这不起作用。

有没有人有任何指针？

感谢

来源

2011-06-16 AJSykes

DockableWindowContent不必在position:absolute。

在绝对把它“出”你的<td>。也许定义#DockableWindow td {position:relative;}会有所帮助......但它似乎没用。

您也可以将height:87%更改为min-height:87%。（note：ie6不知道最小高度是多少）

来源

2011-06-16 14:16:01 Kraz

可滚动内部内容的可停靠DIV

回答

相关问题