10

在尝试设置相对于 GWT 中的另一个元素的弹出窗口时,我看到了一种非常奇怪的行为。似乎设置弹出位置(一个独立的浮动元素)会改变我从 getAbsoluteRight() 或 getAbsoluteLeft() 之类的调用中得到的答案,因为它是一个完全不同的元素,它在页面上是静态的,并且在视觉上不会移动。

我添加了一些打印语句来检查发生了什么,所以这里是代码:

System.out.println(item.td);
int position = item.td.getAbsoluteRight()-offsetWidth;
System.out.println("left/right:" + item.td.getAbsoluteLeft() + "/" + item.td.getAbsoluteRight() + ". sent:" + (item.td.getAbsoluteRight() - offsetWidth) + "=" + position);
popup.setPopupPosition(position, item.td.getAbsoluteBottom());
System.out.println("left/right:" + item.td.getAbsoluteLeft() + "/" + item.td.getAbsoluteRight() + ". sent:" + (item.td.getAbsoluteRight() - offsetWidth) + "=" + position);
popup.addStyleName("bigger");
System.out.println("left/right:" + item.td.getAbsoluteLeft() + "/" + item.td.getAbsoluteRight() + ". sent:" + (item.td.getAbsoluteRight() - offsetWidth) + "=" + position);
System.out.println(item.td);

这是 Chrome 上的结果

Menu displayed, widths: 81/340=340
<td class="hover">Daniel?</td>    
left/right:1104/1185. sent:845=845
left/right:1121/1202. sent:862=845
left/right:1121/1202. sent:862=845
<td class="hover">Daniel?</td>

这是 Firefox 上的结果

Menu displayed, widths: 81/340=340
<td class="hover">Daniel?</td>
left/right:1254/1335. sent:995=995
left/right:1273/1354. sent:1014=995
left/right:1273/1354. sent:1014=995
<td class="hover">Daniel?</td>

所以在调用 setPopupPosition() 后,固定元素的左/右坐标突然改变(X 坐标从 1254 变为 1273),而相关元素实际上保持在同一个位置(视觉上)。我真的不知道它是如何发生的,因为弹出窗口甚至不知道该元素的存在。更重要的是,虽然我可以始终如一地重现错误,但如果我切换弹出内容,它就不会发生......

...顺便说一句,我将firefox给出的坐标与页面截图进行了比较,返回值不仅错误,而且考虑到我的屏幕尺寸(1366x768)并且没有滚动,这是不可能的。

我可能会尝试两次设置位置,因为第二个值实际上是正确的,但我真的很想了解这里发生了什么......

非常感谢!

4

1 回答 1

0

差值正好是 150 像素。(左侧可能总共有 75 个像素)您是否检查过页面:http: //validator.w3.org/ 边距/填充(IE 中也是边框)内经常存在差异。

当我摆脱您的getAbsoluteRight()-offsetWidth代码时,您使用td来获得绝对正确。但是将位置设置在popup. 这应该意味着您在popuptd内容之间有一些边框/边距/填充。

和(getAbsoluteLeft()以及getAbsoluteRight() 顶部和底部)都是根据其父元素的滚动和偏移位置计算的。

此外,空对象通常会以默认宽度结束。但是,一旦您输入内容,大小就会适应其内容。

于 2014-02-11T05:57:58.853 回答