如何讓img在懸停時消失？

Question

當用戶懸停在網頁上時，如何讓網頁中的圖像消失？

Answer 1

試試這個：

<div id="test" name="test" onmouseover="document.getElementById('test_image').style.visibility= 'hidden';" onmouseout="document.getElementById('test_image').style.visibility= 'visible'"> 
<img src="http://www.google.com/intl/en_ALL/images/logo.gif" id="test_image"> 
</div> 

Answer 2

圖像隱藏onHover選項：

<img onmouseover="this.style.visibility = 'hidden';" src="..." /> 

圖像隱藏onHover選項，並重新出現在鼠標移動之後離開

<img onmouseover="this.style.visibility = 'hidden';" onmouseout="this.style.visibility = 'visible';" src="..." /> 

Answer 3

CSS的一點應該解決這個問題：

img:hover { 
    display: none; 
} 

很明顯，你會想指定一個唯一的ID或類（取決於你想要的行爲）。

Answer 4

我試圖做同樣的事情，發現顯示：沒有真正的毛病。

試試這個。

img:hover { 
    opacity: 0; 
} 

Answer 5

Jquery的：

$(document).ready(function() { 
     $("image").hover(function() { 
      $(this).animate({"opacity": "0"}, "fast"); //fast(200 milisec) or slow(600 milisec) 
     }, 
     function() { 
      $(this).animate({"opacity: "1"}, "fast"); 
     }); 
    });