js淡入淡出

示例:　js淡入淡出

原理：更改css不透明数值

知识点：

css不透明

filter:alpha(opacity:30); opacity:0.3;}

小技巧：

小于临界值，做加速

大于临界值，做减速

html部分

<div id="div1"></div>

<style>
#div1 { width:100px; height:200px; background:red; filter:alpha(opacity:); opacity:0.3;}
</style>

js部分

<script>
window.onload=function ()
{
    var oDiv=document.getElementById('div1');

    oDiv.onmouseover=function ()
    {
        startMove();
    };
    oDiv.onmouseout=function ()
    {
        startMove();
    };
};

var alpha=;
var timer=null;

function startMove(iTarget)
{
    var oDiv=document.getElementById('div1');

    clearInterval(timer);
    timer=setInterval(function (){
        var speed=;

        if(alpha<iTarget)    //小于临界值，做加速。同理，反之，亦然
        {
            speed=;
        }
        else
        {
            speed=-;
        }

        if(alpha==iTarget)
        {
            clearInterval(timer);
        }
        else
        {
            alpha+=speed;

            oDiv.style.filter='alpha(opacity:'+alpha+')';
            oDiv.style.opacity=alpha/;
        }
    }, );
}
</script>