2012-03-14 51 views
0

工作,這是我試圖使菜單與衰落的背景,當鼠標懸停在菜單項。它在Firefox(10.0.2),但它並沒有在Chrome(17.0.963.79)工作。我的印象是,使用Chrome 17版本時會出現這種情況。我錯過了什麼?衰落的背景不會在Chrome

<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> 

回答

3

這是報告的問題使用Chrome 16和17.如果您設置<a href="#">然後正常工作,這是與一個問題:在Chrome瀏覽過的標籤。它在鉻上被注意到。

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/檢查出的小提琴,你會看到它工作正常。

E:它已經固定在V18測試階段,所以它不應該更長的時間大約爲一個問題!

+0

謝謝。我應該昨天發佈這篇文章,而不是撕掉我的頭髮,試圖弄清楚我做錯了什麼。 – b10hazard 2012-03-14 15:30:56

+0

不用擔心。不是嗎?你花了這麼長時間的工作,只是意識到你無能爲力! – 2012-03-14 16:04:29