Nomadic Functions
Where selfishness is good™

Accepts three variables: id (referencing the HTML), ln (length of fade in ms), and s (0==none || 1==inline)

Example #1: Fade in @ 100ms
Example #2: Fade in @ 1000ms

JAVASCRIPT

function $(v) { return(document.getElementById(v)); }
function $S(v) { return($(v).style); }
function uni(v,id,s,top) { var ob=$S(id),b=v/100; ob.opacity=b; ob.top=top+'px'; ob.MozOpacity=b; ob.KhtmlOpacity=b; ob.filter="alpha(opacity="+v+")"; }
function zero(v) { v=parseInt(v); return(!isNaN(v)?v:0); }

function fade(id,ln,s) { var top=zero(parseInt($S(id).top));

  function opacity(oStart,oEnd,ln) { var speed=Math.round(ln/100),timer=0;
    
    if(oStart>oEnd) { for(i=oStart; i>=oEnd; i--) { setTimeout("uni("+i+",'"+id+"','','"+(top--)+"')",timer*speed); timer++; } setTimeout("$S('"+id+"').display='none';",timer*speed); }
    else if(oStart<oEnd) { $S(id).display='inline'; for(i=oStart; i<=oEnd; i++) { setTimeout("uni("+i+",'"+id+"','"+1+"','"+(top++)+"')",timer*speed); timer++; } }
  
  }

  if(s==1 || (!s && $S(id).opacity==0)) opacity(0,100,ln); else opacity(100,0,ln);

}

HTML

<a href="javascript:fade('test1',100,1)">Fade in @ 100ms</a> <a href="javascript:fade('test1',100)" id="test1" style="display: none; opacity: 0">Fade out @ 100ms</a><br>
<a href="javascript:fade('test2',1000,1)">Fade in @ 1000ms</a> <a href="javascript:fade('test2',1000)" id="test2" style="display: none; opacity: 0">Fade out @ 1000ms</a><br>

Have ideas for code changes?

CC · GPL · NoFunc.com