Browser Schnick Schnack

[Cybaer]

Hi,

Ich will für eine Seite, als zusätzliches Feature, die Möglichkeit bieten einen Bereich auszublenden. Eigentlich reicht ja display = 'none'
Das geht aber etwas zu zackig, wenn es eine Möglichkeit gäbe - kurz und einfach - das etwas animierter zu bewerkstelligen wäre das nicht schlecht.

Wie immer: mit setTimeout()! ;-)

Und da ich das auch gerade gebraucht habe, gibt's einen Quickie:

function fadein(imgname,steps,time) {
  fadingsteps=((steps>0)?(100/steps):100);
  fadingtime=time;
  fadingname=imgname;
  fadingvalue=100;
  if(is_w3cDOM) {
   transparency("tofade",100);
  document.getElementsByName("tofade")[0].style.visibility="visible";
   window.setTimeout('fading()',fadingtime);
  }
 }
 function fading() {
  fadingvalue-=fadingsteps;
  if(fadingvalue>0 && fadingvalue<100) {
   window.setTimeout("fading()",fadingtime);
  }
  transparency(fadingname,fadingvalue);
 }

Mit dem Aufruf fadein('tofade',50,20); blenden IE und Mozilla sanft ein (50 Stufen von 100 möglichen, mit jeweils 20 ms Timeout-Wartezeit). Zum Ausblenden sollte es im Wesentlichen reichen, das "-" in der ersten fading()-Zeile in "+" zu ändern und fadingValue auf 0 zu setzen.

is_w3cDOM dürfte klar sein (stammt aus http://Coding.vampirehost.de/Systemvariable), transparency() gibt es unter http://Coding.vampirehost.de/Transparenz (alternativ toggle() http://Coding.vampirehost.de/Toggle - unterstützt bereits CSS-3-Transparenz).

Beherrscht das auzublendende Element kein NAME-Attribut, dann nimm die ID und ändere das getElements entsprechen.

Gruß, Cybaer