1

这真的很奇怪。我有这个网站,我有一个列表菜单,菜单中的每个项目都有一个简单的 :hover 效果。

http://w3box.com/mat/

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

现在,我一直在尝试对代码进行验证,以查看可能导致问题的原因。我看过很多关于类似场景的帖子。但它们似乎都不适用于我的情况。

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

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

}

很奇怪,如果我去掉高度规格,就没有滞后!这可能是什么原因造成的?可能是父 li 类的填充和边距层吗?还是那个上面的父类?

这是这些项目的代码。其余的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; }

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

4

1 回答 1

0

我真的没有任何滞后。不过第一次有一点延迟——这很可能是因为背景图像正在加载。

您最好在列表项上正确设置背景,然后在悬停时更改背景位置。(关于这个有很多问题。)

于 2010-01-26T11:31:57.043 回答