嗨,我在jqgrid冻结列演示中看到了chrome(v22)和火狐之间的对齐差异。有人能告诉我为什么会发生这种情况吗?有什么办法可以解决它?
如果你看屏幕截图,你会看到客户和金额列之间的一些水平对齐差异。
你可以在下面的链接上看到同样的现场直播:http://www.trirand.com/blog/jqgrid/jqgrid.html
打开上面的链接并转到最后一节,即冻结的cols组标题。然后在windows XP中的chrome(v22)浏览器中选择冻结列演示或冻结列组标题演示。
但在windows XP的firefox(V15)和safari(v5)中,对齐是正确的。
发布于 2012-10-18 20:43:14
我不能建议你这个问题的真正解决方案,但我决定写下我是如何解释这个问题的。简单的回答是:在计算冻结的div的top
位置时,setFrozenColumns方法存在错误。人们应该改进代码。
有两个div :一个用于冻结的头部( div具有类frozen-div ui-jqgrid-hdiv
),另一个用于冻结的主体(div具有类frozen-bdiv ui-jqgrid-bdiv
)。如果您打开the official jqGrid demo page中的“冻结Cols.Group标题(新)”/“冻结带有组标题的列”演示,并检查不同web浏览器中的top
属性值,您会发现在某些浏览器中,top
的值应该增加或减少到1px才能获得正确的视图。
例如,在Firefox16中,dives有top: 24px;
和top: 70px;
,看起来都没问题。
在IE9中具有相同的值,但要正确查看网格,必须将值更改为top: 25px;
和top: 71px;
同样,在Chrome22中有相同的值top: 24px;
和top: 70px;
。要解决此问题,可以将值更改为top: 23px;
和top: 69px;
您可以使用Chrome的开发工具(IE也是如此)来验证更改top
属性是否解决了这个问题:
更改之后,演示的外观将会完美到至少100%,但如果您将缩放更改为200%,您将看到原始值top: 24px;
和top: 70px;
更好。
我想这个问题的真正解决方案并不容易。其方向是在网格冻结部分的每一行和未冻结部分的每一行上设置高度属性。在the answer中,您将找到该方向的第一步。缺点是在编辑后需要额外的代码来重新计算正确的行高。
发布于 2012-10-12 16:37:25
如果您增大/减小字体大小,在所有浏览器中,对齐方式有时是正确的,有时是错误的。诚然,只有Chrome的默认大小是错误的,而所有其他浏览器(Firefox,Opera,Safari,Internet Explorer)的默认大小都是正确的,但当你改变大小时,所有这些都可以调整/错误调整。不仅是垂直对齐,其他东西也变得丑陋-比如冻结的列和其余列之间的水平空间,甚至它的垂直大小(当您过多地增加或减少它时,它就会变得明显)。
查看DOM,您会发现它实际上呈现了两个表-一个是固定的,用于冻结的列,另一个是可滚动的,用于其余的列。它试图让它们看起来像一个单一的一致的东西,但最终它主要是一个黑客。至于修复,不幸的是我不知道,但由于这是一个比“在Chrome上不起作用”更普遍的问题,我希望插件开发人员最终会修复它。
https://stackoverflow.com/questions/12798428
复制相似问题