妙味——图片淡入淡出

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style>
#img1{
    opacity: 0.3;
    filter: alpha(opacity=30);
    width: 400px;
    height: 400px;
}
</style>
<script>
window.onload=function(){
    var oImg = document.getElementById('img1');

    oImg.onmouseover=function(){
        startMove(100);
    };

    oImg.onmouseout=function(){
        startMove(30);
    };
};

var timer = null;
var alpha = 30;

function startMove(iTarget){
    var oImg = document.getElementById('img1');

    clearInterval(timer);
    timer=setInterval(function(){
        var iSpeed = 0;
        if(alpha<iTarget)
        {
            iSpeed=5;
        }
        else
        {
            iSpeed=-5;
        }

        if(alpha==iTarget)
        {
            clearInterval(timer);
        }
        else
        {
            alpha+=iSpeed;
            // document.title=alpha;
            oImg.style.opacity=alpha/100;
            oImg.style.filter='alpha:(opacity:'+alpha+')';
        }

    },30);
};
</script>
</head>
<body>
<img src="fade.jpg" alt="" id="img1" />
</body>
</html>
高否？富否？帅否？否？滚去学习！