使用css方法：
img{ opacity: 1; } img:hover{ opacity: 0.5; }
用CSS就能实现了！如果想有个缓冲的过程可以使用CSS3的transition。当然如果想兼容低版本的浏览器，还是得用js。
!doctype html>
<html>
<head>
<meta http-equiv="content-type " content="text/html"></meta>
</head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function () {
$("img").fadeTo("slow", 0.5);
$("img").hover(function(){
$(this).fadeTo("slow", 1.0); // 设置透明度为100%
},function(){
$(this).fadeTo("slow", 0.5); // 设置不透明度mouseout回到50%
});
});
</script>
<body>
<img src="image/p1.jpg"/>
</body>
</html>
原文：http://www.cnblogs.com/MissZhao/p/5795019.html