javascript - Explorer 和 safari 中脱节的翻转问题

Question

我从 Dax Assist 获得了一个脱节的翻转脚本： www 。达克斯 com/js/disjointedrollovers.cfm

查看我正在处理的页面：http ://www.gherkin.co.nz/tester/

翻转在 Firefox 上效果很好，但在 Explorer 中，较大的图像显示在中央 div 下，而在 Safari 中，它们似乎根本不起作用。

有任何想法吗？

Answer 1

看起来您的图像正在继承text-align: centerCSS 属性。在样式的 CSS 中覆盖large_card1它或完全删除它。

编辑我查看了您的 HTML，您的页面上似乎有一堆 img 元素，它们的 ID 都是“holder”。您的元素应该只有唯一的 ID。

我建议您删除所有那些重复的 img 标签，因为您只对换掉其中一个感兴趣。我的怀疑是 IE 正在将图像换成<img id="holder"...>它找到的最后一个图像，Firefox 正在使用第一个图像，而 Safari 说，“去他妈的！我太困惑了”并且没有交换任何东西。

Answer 2

当尝试调试这样的问题时，第一步是验证：http://validator.w3.org/check?verbose=1&uri=http: //www.gherkin.co.nz/tester/

还有一些其他问题，但似乎在某些浏览器中造成问题的是图像的重复 ID 属性（元素 id 应该是唯一的），以及您定位的 onmousover/onmouseout id。

在您的情况下，将鼠标悬停在元素上时调用的 changer2 函数正在按 id 查找图像（使用 document.images[id]）。Firefox 返回单个图像，而其他一些浏览器（chrome，可能是 safari）返回一个图像数组，然后该函数无法按预期工作。

所以，第一步：修复你的 id 和你的 changer2 函数的第三个参数。