资源描述：
《实现Javascript透明特效功能》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。
1、实现Javascript透明特效代码可控式Javascript透明特效也就是透明度可以自行设置，但是这种方法在IE7下极有可能失效，不过这些东西对大家了解Javascript透明特效还是有所帮助的。Javascript透明特效是script.aculo.us提到的特效中最简单的特效之一。既然是特效，必须涉及时间与空间的概念。时间我们可以用setTimeout与setInterval，个人比较喜欢setTimeout，虽然它每次调用都重复注册，但可控性比较好。空间就全凭CSS的绝对定位实现位移了。在开始之前，我们练习一下setTimeout的递归用法（用来模拟setInterval）
2、。01.functiontext(el){02. varnode =(typeofel=="string")?document.getElementById(el):el;03. vari=0;04. varrepeat=function(){05. setTimeout(function(){06. node.innerHTML="
"+i+"
";07. i++;08. if(i<=100){09. setTimeout(arguments.callee,100);10. }11. },100
3、)12. }13. repeat();14.}我们来试一下最简单的淡入特效，就是把node.innerHTML那一行改成透明度的设置。01.functionfadeIn(el){02. varnode =(typeofel=="string")?document.getElementById(el):el;03. vari=0;04. varfade=function(){05. setTimeout(function(){ 06. !+"v1"?(node.style.filter="alpha(opacity="+i+")"):(node
4、.style.opacity=i/100);07. i++;08. if(i<=100){09. setTimeout(arguments.callee,100);10. }11. },100)12. }13. fade();14.}但是这样并不完美，因为IE的滤镜可能会在IE7中失效，我们必须要用zoom=1来激活hasLayout。我们再添加一些可制定参数扩充它。注释已经非常详细，不明白在留言里再问我吧。01.functionopacity(el){02. //必选参数03. varnode =(typeofel=="s
5、tring")?document.getElementById(el):el,04. //可选参数05. options=arguments[1]
6、
7、{},06. //变化的持续时间07. duration=options.duration
8、
9、1.0,08. //开始时透明度09. from=options.from
10、
11、0.0,10. //结束时透明度11. to=options.to
12、
13、0.5,12. operation=1,13. init=0;14. if(to-from<0){15. operation=-1,16. init=1;17.
14、 }18. //内部参数19. //setTimeout执行的间隔时间，单位毫秒20. varfrequency=100,21. //设算重复调用的次数22. count=duration*1000/frequency,23. //设算每次透明度的递增量24. detal=Math.abs(to-from) /count,25. //正在进行的次数26. i=0;27. varmain=function(){28. setTimeout(function(){29. if(!+"v1"){30. if(node.currentSt
15、yle.hasLayout) node.style.zoom=1;//防止滤镜失效31. node.style.filter="alpha(opacity="+(init*100+operation*detal*i*100).toFixed(1)+")"32. }else{33. node.style.opacity= (init+operation*detal*i).toFixed(3)34. }35. no
