手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >一个简单的js渐显(fadeIn)渐隐(fadeOut)类
一个简单的js渐显(fadeIn)渐隐(fadeOut)类
摘要:要兼容IE(element.style.filter='alpha(opacity=value)')和非IE(element.style.o...

要兼容IE(element.style.filter = 'alpha(opacity=value)')和非IE(element.style.opacity=value)就可以了。

另,还要注意,非IEopaciy的值是0~1之间,IE是1-100。

一个简单的js渐显(fadeIn)渐隐(fadeOut)类1

一个简单的js渐显(fadeIn)渐隐(fadeOut)类2

下面,贴代码:

复制代码 代码如下:

/**

* @projectDescription 动画(渐显、渐隐)类

* /**

* @projectDescription KINGKIT UI

* @date 2010-6-1

* @author Kit.Liao

* @copyright kingkit.com.cn

* @version 0.9.0

* @感谢:http://www.cnblogs.com/rubylouvre/archive/2009/09/16/1566699.html

* 使用示例:渐显:KUI.Animation.fadeIn(el);渐隐:KUI.Animation.fadeOut(el)

*/

KUI.Animation = {

fadeIn: function(id){

this.fade(id, true);

},

fadeOut: function(id){

this.fade(id, false);

},

fade: function(id, flag){

var target = KUI.get(id);

target.alpha = flag?1:100;

target.style.opacity = (target.alpha / 100);

target.style.filter = 'alpha(opacity=' + target.alpha + ')';

var value = target.alpha;

(function(){

target.style.opacity = (value / 100);

target.style.filter = 'alpha(opacity=' + value + ')';

if (flag) {

value++;

if (value <= 100) {

setTimeout(arguments.callee, 15);//继续调用本身

}

}

else {

value--;

if (value >= 0) {

setTimeout(arguments.callee, 15);//继续调用本身

}

}

})();

}

}

打包下载

【一个简单的js渐显(fadeIn)渐隐(fadeOut)类】相关文章:

Nodejs中session的简单使用及通过session实现身份验证的方法

简单的防盗链功能代码(iframe)

对联浮动广告效果

jQuery Timelinr实现垂直水平时间轴插件(附源码下载)

一个很Cool的JS菜单效果

JavaScript中关联原型链属性特性

深入理解JavaScript的React框架的原理

JavaScript中用toString()方法返回时间为字符串

JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

简单谈谈javascript中this的隐式绑定

精品推荐
分类导航