jquery-plugins – 使用chrome浏览器的jqgrid冻结列问题

嗨,我看到chrome(v22)和firefox之间的jqgrid冻结列演示中的对齐差异.任何人都可以告诉我它为什么会发生这种情况以及它的修复方法.

如果查看屏幕截图,您会看到客户端和Amount列之间存在一些水平对齐差异.

您可以在以下链接中看到相同内容：
http://www.trirand.com/blog/jqgrid/jqgrid.html

打开上面的链接并转到最后一节,即冻结cols组头.然后在Windows XP中的chrome(v22)浏览器中选择冻结列演示或冻结列组头演示.

但是在Windows XP中firefox(v 15)和safari(v5)中的对齐是正确的

解决方法

我不能建议你真正解决问题,但我决定写下我如何解释问题.简短的回答是：在计算冻结div的顶部位置时,setFrozenColumns方法中存在一个错误.一个人应该改进代码.

有两个div：一个用于冻结的标题(div具有类cold-div ui-jqgrid-hdiv),另一个用于冻结的body(div具有类frozen-bdiv ui-jqgrid-bdiv).如果从the official jqGrid demo page打开“Frozen Cols.Group Header(new)”/“Frozen group with group header”演示并检查不同Web浏览器中顶级属性的值,您会发现在某些浏览器中top应该增加或减少到1px以获得正确的视图.

例如在Firefox 16中潜水最多：24px;和顶部：70px;一切看起来还不错.

在IE9中,一个具有相同的值,但要正确查看网格,必须将值更改为top：25px;和顶部：71px;

以同样的方式,一个具有相同的值top：24px;和顶部：70px;在Chrome 22.要解决问题,可以将值更改为top：23px;和顶部：69px;

您可以使用Chrome的开发人员工具(以及与IE相同的工具)来验证更改top属性可以解决问题：

在更改之后,演示的外观将至少在100％完美,但如果您将缩放更改为200％,您将看到原始值最高：24px;和顶部：70px;更好.

我想这个问题的真正解决方案并不容易.它在网格的冻结部分的每一行和非冻结部分的每一行上设置高度属性的方向.在the answer,你会找到方向的第一步.缺点是在编辑之后需要额外的代码来重新计算行的正确高度.