zoukankan      html  css  js  c++  java
  • [Js]淡入淡出的图片

    效果:鼠标移入时,图片由半透明逐渐变成清晰,移出时,由清晰变为半透明

    分析:用变量来储存透明度,因为元素.style.alpha不能直接增加或减少

    window.onload=function(){

        var oDiv=document.getElementById("div1");

        var timer=null;

        var alpha=30;

        oDiv.onmouseover=function(){

            setAlpha(100);

        };

        oDiv.onmouseout=function(){

            setAlpha(30);

        };

        function setAlpha(iTarget){    //iTarget目标透明度通过参数传入

            clearInterval(timer);        //执行计时器之前,先清除计时器,否则执行完一次再执行,上次的计时器还在,会不停抖动

            timer=setInterval(function(){

                var iSpeed;

                if(alpha<iTarget)

                {

                    iSpeed=10;

                }

                else

                {

                    iSpeed=-10;

                }

         if(alpha==iTarget)

         {

             clearInterval(timer);

         }

         else

         {

           alpha+=iSpeed;

           oDiv.style.opacity=alpha/100;

           oDiv.style.filter='alpha(opacity:'+alpha+')'

         }

            },30);

        };

    };

  • 相关阅读:
    arm-linux-3.4.2移植for2440
    编译内核是出现:arch/arm/mm/tlb-v4wbi.S:64:error: too many positional arguments
    poj3050 Hopscotch
    poj3187 Backward Digit Sums
    poj2718 Smallest Difference
    hihocoder offer收割编程练习赛10 C 区间价值
    poj1862 Stripies
    poj3262 Protecting the Flowers
    poj2229 Sumsets
    poj2385 Apple Catching
  • 原文地址:https://www.cnblogs.com/zhangwenkan/p/3608195.html
Copyright © 2011-2022 走看看