jQuery IE8 - Firefox问题

Question

我有一个使用jQuery框架的IE8的大问题。

什么在Firefox上有效，在IE8中不能正常工作。我甚至不检查IE7 :)。

基本上，我有简单的动画显示/隐藏div层，也移动上/下 - 左/右一些div层。没什么特别的，只是在页面上添加一些动作。所以当你点击联系人，而不是导航向上移动并显示联系人时，联系人向下移动并打破布局，这并不是什么大问题，但是当你按下客户区并按下联系人时 - 它完全打破了布局 - 大问题。

请帮忙。 您可以浏览网站here

Answer 1

不明白“它完全打破了布局”的含义。我只在IE浏览器中看到当你访问客户区时页面震动。这是由于高度和“自动”滚动条。拥有一个固定的y滚动条不是一个好的解决方法。

但是在访问客户区域后单击联系链接并没有显示与FF中的不同之处。

快速浏览HTML源代码后，我只能说你确实需要摆脱HTML过渡性DTD并获得HTML严格的DTD。它将解决大部分与CSS相关的问题。 Learn more here。

Answer 2

一些观察。首先，您在“#moveContact”上描述的IE8行为仅适用于正常模式。如果点击“兼容模式”，URL框右侧的断开的页面图标，则会出现不同的（并且仍然是错误的）行为。

其次，包括jQuery的方式是这样的：

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js 

我会鼓励你提供你自己的jQuery的副本。你可以这样做here。我会去最新的1.3.2。这可能会解决您的问题。我注意到1.3版的发布说明显示了针对IE7的最新IE测试。

Answer 3

我注意到代码依赖于marginTop属性来动画元素。

例如为的联系人信息的单击事件处理程序：

$("#moveContact").click(function(){ 

利用了marginTop属性：

marginTop: "167px", 

这是在Internet Explorer越野车，并可能导致意外的行为。有关更多信息，请参见article about margin-top。

这不是jQuery的问题，它与Internet Explorer解释margin-Top值的方式有关。我不确定这是否是动画不能正常工作的原因，但这将是一个开始寻找的好地方。

Answer 4

+1 Daniel：由保证金崩溃问题引起的。即使没有IE问题，保证金崩溃也足以让人困惑，并且通常最好避免。将动画更改为仅使用填充和定位将使其更加可靠。

此外，您需要从事件处理程序中的return false停止正在遵循的#链接，导致浏览器跳回到页面顶部。

最后，给每个具有position（相对或绝对）的元素一个明确的z-index属性以避免IE7默认它们的错误，从而导致错误堆叠，导致联系地址不可见。