如何让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"); 
     }); 
    });