2010-01-26 58 views
1

这真的很奇怪。我有这个网站,我有一个列表菜单,在菜单中的每个项目上都有一个简单的:悬停效果。CSS - :悬停在IE7中缓慢/迟缓

http://w3box.com/mat/

在Firefox它工作得很好。但我IE7 atleast有一个滞后。我没有在IE8中测试过,但我的猜测是它也在那里。

现在,我一直在尝试验证代码以查看可能导致问题的原因。我看过很多关于类似场景的文章。但他们似乎都不适用于我的案子。

所以刚才我注意到,在我的CSS样式表,我有这样的:

li:hover { 
background-image: url(img/TopLine.png); 
Height:29px; 

}

自叹不如,如果我删除了高度规范,没有滞后!什么可能导致这个?它可以是父级李类的填充和边距层吗?或者上面那个父类?

这是这些项目的代码。其余的CSS你可以在网站的/main.css下

#header { 
padding-right:7%; 
height: 57px; 
background-image:url(img/TopLine.png); } 

.header a { 
font-family:georgia; 
font-size:22px; 
color:#ebebeb; 
text-decoration:none; } 

.header li { 
float:right; 
list-style: none; 
margin-top:10px; 
padding-top:18px; 
padding-left: 23px; 
padding-right: 23px; 
height:23px; } 

li:hover { 
background-image: url(img/TopLine.png); 
Height:29px; } 

有关我如何改进这一点的任何想法?

+3

您挪威人似乎有*无聊*美食! ;) – 2010-01-26 11:20:58

+0

我会把我的钱放在你到达那里的''。当您删除自定义字体时它工作吗? – Kobi 2010-01-26 11:21:58

+0

但是这种现象真的很奇怪,我在IE7上遇到了很大的延迟,而在IE8上却有一个很小的延迟。我能想到的唯一罪魁祸首是cufon的文字。你可以尝试删除,只是为了看看是否有任何改变? (编辑:啊,Kobi已经说过了。) – 2010-01-26 11:23:37

回答

0

我真的没有任何滞后。虽然第一次有轻微的延迟 - 这很可能是因为背景图像正在加载。

您最好在适当的列表项上设置背景,然后更改悬停时的背景位置。 (关于此,有很多关于SO的问题。)

+0

这很奇怪@DisgruntledGoat,即使在一台功能相当强大的机器上,IE7也会出现明显的滞后 - 不过它在IEtester中。你有没有尝试过一个“真正的”IE7? – 2010-01-26 11:45:25

+0

不确定您在设置列表项背景上的含义?你能详细说明一下吗?它是不是使用:悬停。 顺便说一句,我试着设置:悬停在'a:悬停'和'.header:悬停'等等,而且滞后发生了,这很奇怪,但我不知道为什么它似乎只发生在我设置它时虽然高度也许我需要重新定位整个菜单 – 2010-01-26 15:08:42

+0

@Pekka:不,我只是使用兼容模式。 – DisgruntledGoat 2010-01-27 10:40:09