0

我使用了来自 2 个来源的一些代码来帮助我用大型菜单和幻灯片过渡来美化一个页面。我对 jQ 和 CSS 进行了一些更改以满足我的需要。我遇到了各种闪烁的问题(尤其是 Internet Explorer (9)。幻灯片会出现在巨型菜单下拉列表前面一秒钟然后返回。我不认为它是 z -index 问题,因为它处理它;只是还不够早。我在这里把它放到一个 jsfiddle 中:http: //jsfiddle.net/SeanPRyanKC/53RRy/

我知道解决问题的方法是不使用现代文档类型和兼容性,例如:

<!DOCTYPE html>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

如果我使用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

该页面现在可以完美运行,但我失去了圆角和渐变等。谢谢

4

2 回答 2

2

尝试添加position: relative; z-index:100;#menu li属性。

如果您在 Chrome Devtools 或 Firebug 中观看幻灯片,当幻灯片图像发生变化时,它会临时将<a>标签的 z-index 设置为 10。因此,要摆脱这个问题,只需将 z-index 设置为<li>较高的比起那个来说。

于 2013-10-10T15:14:49.193 回答
2

添加新的 CSS

.slidesjs-control{z-index:-1}

演示:http: //jsfiddle.net/53RRy/9/

于 2013-10-10T15:24:19.203 回答