FireFox,IE下图片渐变示例

<img src="13_dp.gif" name="TestImg" width="87" height="87" border="0" id="TestImg" style="0px;overflow:hidden;position:absolute;top:0px;filter:alpha(opacity=30);moz-opacity: 0.3;" title="渐变" onmouseover="addOpacity(this,5,30,100);" />

<script language="javascript">

var IE=!!(window.attachEvent && !window.opera);

var Opera=!!window.opera;

//设置图片透明度

    function setOpacity(id,value)

    {

       if(IE || Opera) {

            id.filters.alpha.opacity = value*100;

       }else

        {

           id.style.MozOpacity = value;

           id.style.Opacity = value;

       }

   }

    

    //透明度间变

    //id:目标引用,step:变化步长可为正或负,currentValue:当前值,targetValue:目标值

    function addOpacity(id,step,currentValue,targetValue)

    {

       if(step <0 && currentValue<=targetValue || step >0 && currentValue >= targetValue)

           return;

      currentValue = currentValue + step;

       setOpacity(id,currentValue/100);

       setTimeout(function(){addOpacity(id,step,currentValue,targetValue);},

           50);

    }

</script>

原文地址:https://www.cnblogs.com/top5/p/1542582.html