css - Gwt 应用程序上的“粘性”面板

Question

我有一个HorizontalPanel跨越页面宽度的 GWT 应用程序，用作应用程序的“顶栏”。但是，我想让它“粘性”，即当页面内容增长时，当滚动条出现时，滚动时我希望所说HorizontalPanel的内容保持在顶部。是否可以使用 GWT 和/或 GQuery 的帮助？

Answer 1

通过使用 CSS：

向您的 Horizo​​ntalPanel 添加/设置一个 CSS 类

myHorizontalPanel.setStyleName("onTop");

在你的css文件中：

.onTop{
  position: fixed;
  top: 0px;
  left: 0px;
  /* adapt width and heigth to fit your needs */
  width:100%;
  height:40px;
}

这应该够了吧

Answer 2

您可以使用DockLayoutPanel来划分页面。把你的酒吧g:north和滚动面板上g:center。这样，如果滚动面板内的内容溢出，滚动条将仅出现在“内容”部分。

<g:DocLayoutPanel unit="PX">
    <g:north size="40"> <!-- you must provide a fixed size, you can change it later -->
       your bar content
    </g:north> 
    <g:center>
      <g:ScrollPanel> <!-- it will be stretched to ocuppy all available space -->
         here goes your content
      </g:ScrollPanel>
    </g:center>
</g:DocLayoutPanel>