JavaScript淡入淡出渐变简单实例

本文实例讲述了Java脚本语言淡入淡出渐变的实现方法。分享给大家供大家参考。具体如下：

这里介绍Java脚本语言淡入淡出的文字渐变例子，用射流研究…来控制差异标签元素实现渐变显示，渐变隐藏，只要在那个标签里的内容，都可以淡入淡出，代码简单，便于修改完善，前端设计者必备的网页特效。

运行效果如下图所示：

具体代码如下：

！DOCTYPE html heart heta http-equiv=' Content-TYPe ' Content=' text/html；charset=utf-8' /titlejs代码控制元素简单的淡入淡出效果/title style * { margin 33600；padd :0 } body { font :12 px Verdana，Arialcolor: # 777背景# 222 } a { color : # 999 text-装饰： none } a :悬停{ color : # BBB } #包装器{ width :500 pxmargin:75px auto } #按钮{height:35px} .按钮{ border:1px固体# eee背景# ccc边界半径：3 px-moz-边界-半径：3 pxpadding:4px 0 5px宽度宽度：245px文本对齐：居中；光标：指针指针；float:leftcolor : # 555 }。按钮：悬停{边框：1 px实心# fff背景： # d9d 9；color:#333} .向右浮动{ float : right } # fade { opa city 33600；filter:alpha(不透明度=' 0 ')边框-半径：3 px-moz-边界-半径：3 px边距-底部：10 pxpadd :9 px 10px 0；高度：26 pxborder:1px固体# 548954;背景技术# 355 c33 color : # 79af 72 text-shadow :1 px 1px # 21341d }/style script type=' text/JavaScript ' var fade effect=function(){ return { init : function(id，flag，target){ this。elem=文档。getelementbyid(id)；clearInterval(这个。艾伦。si)；这个。目标=目标？目标：标志？100 : 0;这个。flag=flag | |-1；this=this . elem . style。不透明度？parseFloat(这个。艾伦。风格。不透明度)* 100 : 0；这个。si=setInterval(function(){ fade effect。tween()}，20)；}，tween :函数(){ if(this。alpha==这个。target){ clearInterval(这个。si)；}else{ var值=数学。圆(这个。alpha((这个。瞄准这个。)* 0.05))(1 *这个。旗帜)；这个。艾伦。风格。不透明度=值/100；this.elem.style.filter='alpha(不透明度=“值”)；这个。alpha=value } } })；/script/head dydiv id=' wrapper ' div id=' fade ' JAVAScript淡入淡出渐变例子/div div id=' buttons ' div class=' button ' onclick=' fade effect。init '(渐弱，1)'淡入/div class=' button float trict ' onclick=' fade effect。init '(渐弱，0)'淡出/部门/部门私营部门筹资和伙伴关系司有关更多信息，请访问样式版权所有br //p/div/body/html希望本文所述对大家的爪哇岛描述语言程序设计有所帮助。