jQuery IE8 - Firefox问题

Question

我在使用jQuery框架的IE8中遇到了一个大问题。

什么适用于Firefox，它在IE8中不起作用。我甚至没有检查IE7 :)。

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

请帮忙。 您可以查看网站here

Answer 1

+1 Daniel：由边缘崩溃问题引起。即使没有IE问题，保证金崩溃也足够混淆，通常最好避免。将动画更改为仅使用填充和定位将使其更可靠。

此外，您需要从事件处理程序return false停止跟踪#链接，从而导致浏览器跳回页面顶部。

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

Answer 2

不明白“它完全打破布局”意味着什么。我只看到在IE中，当您访问客户区时页面会震动。这是由于高度和“自动”滚动条。有一个固定的y滚动条是一个很好或更好的解决方法。

但是，在访问客户区后单击联系人链接并不会显示与FF中不同的内容。

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

Answer 3

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

e.g。联系信息的click事件的处理程序：

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

使用marginTop属性：

marginTop: "167px",

这是Internet Explorer中的错误，可能会导致意外行为。有关详细信息，请参阅此article about margin-top。

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

Answer 4

一些观察结果。首先，您在“#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。