Using JS to simulate jquery's show and hide animation function code _javascript tips

Copy Code code as follows:

Returning DOM elements by ID
var $ = function (ID) {return document.getElementById (ID);}
Returns the current CSS value of a DOM element
var getcss = function (obj,name) {
Ie
if (Obj.currentstyle) {
return Obj.currentstyle[name];
}
Ff
else {
var style = Document.defaultView.getComputedStyle (obj,null);
return Style[name];
}
}

Hide function:

Copy Code code as follows:

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 ';
}
Get the width and height of the DOM
var owidth = getcss (obj, ' width '), oheight = Getcss (obj, ' height ');
Decrements per dom (equal proportions)
var wcut = 10* (+owidth.replace (' px ', ')/+oheight.replace (' px ', '), hcut = 10;
Working with animation functions
var process = function (width,height) {
width = +width-wcut>0?+width-wcut:0;
Height = +height-hcut>0?+width-hcut:0;
Judge if it's done.
if (width!== 0 | | height!== 0) {
Obj.style.width = width+ ' px ';
Obj.style.height = height+ ' px ';

settimeout (function () {process (width,height);},speed);
}
else {
After the reduction, set the property to hidden and the width and height of the original 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 ', '));
}

The show function is similar to the Hide function, but it's just the opposite.

Copy Code code as follows:

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<wadd?+owidth:wadd+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);
}

Calling methods such as:

Copy Code code as follows:

Hide (' A ', ' normal ', function () {
Show (' A ', ' normal ');
});

Uh... Feel good written redundancy, but do not know how to optimize, I hope that a master can write a more concise ...