首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

写个fade练上手

2012-10-16 
写个fade练下手!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/

写个fade练下手

<!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"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>test</title></head><body><div id="abc" style="background-color:red; width:400px; height:300px;"></div><div id="def" style="background-color:black; width:400px; height:300px;"></div><script>function Fade(type,delay,callback){var it=delay || 10 ,time,a=0,b=100,that=this;function set(i){this.style.filter ="alpha(opacity=" + i + ")";this.style.opacity= i/100;}function clear(){clearInterval(time);if(callback){callback.call(this);}}({'in':function(){set.call(that,0);time=setInterval(function(){a++;if(a<=100){set.call(that,a);}else{clear.call(that);}},delay)},'out':function(){set.call(that,100);time=setInterval(function(){--bif(b>=0){set.call(that,b);}else{clear.call(that);}},delay)}}[type])();arguments.callee.init=function(a){set.call(this,a);} }var d=document.getElementById('abc');var e=document.getElementById('def');Fade.call(d,'out',10,function(){Fade.call(d,'in',15,function(){Fade.call(d,'out',10,function(){Fade.call(d,'in',15,function(){Fade.call(e,'in',15,function(){setTimeout(function(){alert('end');},500);});});});});});Fade.init.call(e,0);</script></body></html>

热点排行