Question

编辑：客户端希望通过禁用IE中的单击和拖动功能进行一些测试，因此在此刻您将无法复制该错误。我理解这是否会影响社区帮助解决最终潜在问题的能力。

所以这就是问题所在。当屏幕高度或更具体地说浏览器高度小于网站主容器的高度时，它发生在IE9和IE8中。该网站水平滚动，因此它的总高度约为700或800像素。

要重现此错误，您必须在IE9中打开此网址：http://dev.gregoryfca.com/，并使浏览器的高度大约为500或600像素。因此，这将强制页面从上到下垂直滚动。

将它一直保持在顶部，这样您仍然可以看到G徽标和菜单以及社交图标。然后点击白色区域，不要放手。您可以单击“我们的人员”部分旁边的白色区域。

单击“开始”将鼠标向右拖动。这将启动页面滚动并允许您使用水平滚动功能。

所以这就是错误。在IE9中，当浏览器高度小于网站总高度时，在中间部分单击并拖动以水平滚动时，整个页面垂直向下跳动，使屏幕的绝对顶部位于＃drag-wrapper的顶部元件。

当你水平滚动时，我不希望页面跳转。如果您在Chrome或Firefox中将相同的环境组合在一起，您会发现此处没有此错误。

我认为它与IE处理具有特定定位的聚焦元素的方式有关，或类似的东西。正如您将看到的，该网站使用了大量的jQuery。

有没有人有任何想法。我基本上已经筋疲力尽了我能想到的一切。

Answer 1

尝试将left和top属性赋予此css类：

#drag-wrapper {
  height: 610px;
  margin: 35px 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  left:0;
  top:150px;
  width: 100%;
  -moz-tap-highlight-color: rgba(0,0,0,0);
  -moz-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  z-index: 4000;
}

正如您所看到的，此类有position:absolute但它没有left和top属性。如果需要，请margins to 0。

在整个页面跳跃的IE9中非常奇怪的问题

1 个答案: