Question

我正在帮朋友做一点jquery，而且这是一些简单的CSS工作......但我不是CSS专家，而且（像往常一样）在IE7中表现得很傻 - 我想它们在IE8中很好，但是客户端需要它在IE7中运行...嗯。

我忘记提及具体问题：

主导航包含下拉列表。在IE7中它不起作用。
内容/图片滚动条有点滑稽 - 第一张图片周围有一个边框（应保留为背景图片）。在IE7中，它会滚动第一张图像。

你能请通过显示我的错误来帮助我！？我不确定问题是什么，但我几乎可以肯定它与CSS有关......

欢迎提出建议和想法！谢谢你的时间！我知道IE有时会很痛苦！：）

这是开发网站link。

Answer 1

尝试添加到style.css：

li.drop-down > A {
    text-indent: -4000px;
    width: 4000px;
}

IE 7没有触发mouseenter事件，可能是因为它无法看到具有如此大缩进的元素。添加宽度至少使浏览器更容易看到。

编辑：或者您可以在li本身触发mouseenter，而不是锚点。

$("li.drop-down").bind("mouseenter",function(){
  var _li=$(this);
  $(".subMenu").slideUp("fast");
  $("."+_li.attr("id")).stop(true, true).slideDown("fast");
});

至于背景边框问题，请尝试在普通DIV中包装UL图像。

<div>
  <ul style="width: 3100px; margin-left: -384.733px;"><li style="margin-left: -620px; float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder4.jpg" alt="Fourth Picture"></li>
    <li style="float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder.jpg" alt="jQueryPlaceHolder"></li>
    <li style="float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder2.jpg" alt="Second Picture"></li>
    <li style="float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder3.jpg" alt="Third Picture"></li>
    <li style="float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder4.jpg" alt="Fourth Picture"></li>
    <li style="float: left;"><img src="Eastside%20Baptist%20Home%20Page_files/jQueryPlaceHolder.jpg" alt="jQueryPlaceHolder"></li>
  </ul>
</div>

IE7 CSS / Js Bugs

1 个答案: