一千萬個為什麽

搜索

show-hide image onmouseover

我有3個圖像在彼此之上。第一個是普通的.jpg圖像,第二個是灰度版本,第三個是我用透明的.png添加的某種效果。

現在我想要的是,如果我將鼠標移到這些圖像上,灰度圖像將被隱藏或替換為另一個圖像,然後再次可見。

這裏的問題是我是一個js noob,所以我很難找到解決方案^^

我的代碼看起來像這樣:

<html> 
<head>
</head>

<body>
  • <div class="frame"> <div class="image"></div> <div class="greyscale"></div> <div class="effect">qwert</div> </div>
  • <div class="frame"> <div class="image"></div> <div class="greyscale"></div> <div class="effect">qewrt</div> </div>
</body>
</html>

如果有人可以幫助我:)會非常棒的:)

最佳答案

嘗試這個:

.frame:hover .greyscale { display: none; }

轉載註明原文: show-hide image onmouseover