我的应用程序有几个jqGrids,可能包含或不包含足够的行,需要垂直滚动条.但是,可以在创建行之后将行动态地添加到这些网格中,以便网格最终可能需要滚动条.
问题是如果网格没有足够的行来要求滚动条,则网格右侧会有空白区域.我想以某种方式解决这个问题 – 要么总是显示垂直滚动条,要么在必要时以某种方式动态添加它.
我尝试将以下CSS添加到网格的.ui-jqgrid-bdiv div中:
overflow-y: scroll;
使用以下jQuery(代码很难看,我知道):
$("#mygrid").closest(".ui-jqgrid-bdiv").attr("style",$("#mygrid").closest(".ui-jqgrid-bdiv").attr("style") + " overflow-y: scroll; ");
这在Firefox和Chrome上工作正常,但在IE上,网格从不显示滚动条(无论我添加多少行,它们都会添加到网格底部,而且不会出现垂直滚动条).
任何帮助表示赞赏!
解决方法
overflow-y是CSS3,它还没有被IE完全支持(叹息……)
所以,我想你可以做的唯一2件事情,没有任何其他标记,是使用overflow:auto(这将让浏览器决定)或overflow:scroll,这将强制垂直和水平滚动条.
解决方法可能是将整个网格包装在具有最小高度的较大div中,因此您将其设置为等于浏览器窗口1px.这样你就可以强制使用垂直滚动条了.
在所有浏览器中设置最小高度可能很棘手,但我发现这在大多数浏览器中都很有用.
.the-wrapper{ height: auto !important; /* for real browsers*/ height: 601px; /* IE6 will use this a min-height. Use any height you need - you can even set this using JavaScript depending on the browser window height */ min-height: 601px; /* for real browsers - same value as height */ }
当然,这会在网格下面增加一些空间.欢迎登机!