一聚教程网:一个值得你收藏的教程网站

最新下载

js显示,隐藏函数

时间:2010-09-20 00:00:00 编辑:简简单单 来源:原创

var hide = function(obj,speed,fn){
obj = $(obj);

if (!speed) {
obj.style.display = 'none';
return;
}
else{
speed = speed==='fast'?20:speed==='normal'?30:50;
obj.style.overflow = 'hidden';
}
//获取dom的宽与高
var owidth = getcss教程(obj,'width'), oheight = getcss(obj,'height');
//每次dom的递减数(等比例)
var wcut = 10*(+owidth.replace('px','') / +oheight.replace('px','')),hcut = 10;
//处理动画函数
var process = function(width,height){
width = +width-wcut>0?+width-wcut:0;
height = +height-hcut>0?+width-hcut:0;
//判断是否减完了
if(width !== 0 || height !== 0) {
obj.style.width = width+'px';
obj.style.height = height+'px';

settimeout(function(){process(width,height);},speed);
}
else {
//减完后,设置属性为隐藏以及原本dom的宽与高
obj.style.display = 'none';
obj.style.width = owidth;
obj.style.height = oheight;
if(fn)fn.call(obj);
}
}
process(owidth.replace('px',''),oheight.replace('px',''));
}

显示函数

 

var show = function(obj,speed,fn){

obj = $(obj);

if (!speed) {
obj.style.display = 'block';
return;
}
else{
speed = speed==='fast'?20:speed==='normal'?30:50;
obj.style.overflow = 'hidden';
}

var owidth = getcss(obj,'width').replace('px',''), oheight = getcss(obj,'height').replace('px','');
var wadd = 10*(+owidth / +oheight),hadd = 10;

obj.style.width = 0+'px';
obj.style.height = 0+'px';
obj.style.display = 'block';

var process = function(width,height){
width = +owidth-width height = +oheight-height

if(width !== +owidth || height !== +oheight) {
obj.style.width = width+'px';
obj.style.height = height+'px';

settimeout(function(){process(width,height);},speed);
}
else {
obj.style.width = owidth+'px';
obj.style.height = oheight+'px';
if(fn)fn.call(obj);
}
}
process(0,0);
}

文章评论

热门栏目