Question

当我将鼠标盘旋在菜单项上时，这是我尝试制作一个背景渐变的菜单。它适用于Firefox（10.0.2），但在Chrome（17.0.963.79）中不起作用。我认为这可以使用Chrome版本17.我缺少什么？

<html>
<head>
<style type="text/css">
<!--
div.Menu{
    border: solid black 4px;
    width: 200px;
    background-color: #ffffff;
}

div.MenuItem{
    border: solid black 3px;
    margin: 3px;
    height: 20px;
    background-color: #ff0000;
    transition: background-color 200ms ease-out;
    -moz-transition: background-color 200ms ease-out; 
    -webkit-transition: background-color 200ms ease-out;
    -o-transition: background-color 200ms ease-out;
}

div.MenuItem:hover{
    background-color: #ffff00;
}
-->
</style>
</head>
<body>
    <div class="Menu">
        <a href=""><div class="MenuItem"></div></a>
        <a href=""><div class="MenuItem"></div></a>
        <a href=""><div class="MenuItem"></div></a>
        <a href=""><div class="MenuItem"></div></a>
        <a href=""><div class="MenuItem"></div></a>
        <a href=""><div class="MenuItem"></div></a>
    </div>
</body>
</html>

Answer 1

这是Chrome 16和17报告的问题。如果您设置了<a href="#">，那么它可以正常工作，这与Chrome中的：visited标记有关。它在铬上被注意到。

After some experimentation, it seems to have something to do with <a href> being "visited". Non-visited links fade properly, and I think divs work fine too.

Source

例如，如果您在此处查看小提琴http://jsfiddle.net/joshuamartin/hRAu4/1/，您会发现它可以正常工作。

是的：它已在v18测试版中得到修复，所以它不应该成为问题的时间更长！

淡入淡出的背景在Chrome中不起作用

1 个答案: