li:hover 与 Cufon 的行为迟缓
编辑：发现即使没有应用 Cufon 也会发生这种情况！ Edit2：我的错，看起来Cufon 正在创造缓慢的结果。 但是，删除用 Cufon 替换 menuwrapper 字体样式的行仍然会导致行为缓慢。因此，这似乎与将 cufon 应用于列表本身没有任何关系。
您好，我正在使用 Cufon 将自定义字体“嵌入”到我的网站。这种字体用在主菜单上，我遇到了一个错误或其他问题，即设置 li:hover 的高度、填充或任何内容会使 IE 变得缓慢。我不知道为什么会发生这种情况，但当我从 li:hover 中删除该属性时，问题就消失了。不过它在 Firefox 中运行良好。
所以我的问题是，还有其他方法可以解决这个问题吗？
我基本上想做的是定位 li:hover 因为它有背景。我想将它向底部倾斜几个像素。
我的 CSS 看起来像这样：
#menuwrapper {
float:right;
margin-top:10px;
height: 65px;
}
.menuwrapper li {
float:right;
list-style: none;
margin-top:10px;
padding-top:18px;
padding-left: 23px;
padding-right: 23px;
height:23px;
}
.menuwrapper a{
font-family:georgia;
font-size:22px;
color:#ebebeb;
text-decoration:none;
}
.menuwrapper li:hover {
background-image: url(img/MenuHover.png);
padding-bottom:6px;
}
Edit: Found out that this happens even though Cufon isn't even applied!
Edit2: My bad, looks like Cufon is creating the slowless afterall.
However, removing the line where I replace the menuwrapper font style with Cufon still results in sluggish behaviour. So it doesn't seem like it's got anything to do with applying cufon to the lists themselves.
Hi, I'm using Cufon to "embed" a custom font to my site. And this font is used on the main menu and I've encountered a bug or something where setting the height, padding or anything of the li:hover makes IE go sluggish. I don't know why this happens but the problem dissapears when I remove the property from the li:hover. It works fine in Firefox though.
So my question is, is there another way of getting around this?
What I'm basically trying to do is to position the li:hover because it has a background to it. And I want to skew it a few pixels towards the bottom.
My CSS looks like this:
#menuwrapper {
float:right;
margin-top:10px;
height: 65px;
}
.menuwrapper li {
float:right;
list-style: none;
margin-top:10px;
padding-top:18px;
padding-left: 23px;
padding-right: 23px;
height:23px;
}
.menuwrapper a{
font-family:georgia;
font-size:22px;
color:#ebebeb;
text-decoration:none;
}
.menuwrapper li:hover {
background-image: url(img/MenuHover.png);
padding-bottom:6px;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
无法理解您的确切意思，但正如您所说，您希望将其底部降低一点，那么您可以使用 margin-top css 属性来做到这一点。
Could not understand what you mean exactly but as you said you want to get it a bit lower at the bottom, then you can do that with margin-top css property.
我想只能把这个人弄死了。像现在这样，一事无成。
Just have to lay this one dead I guess. Getting nowhere with it as it is now.