tobiasbaumgaert: DIV faden

Hallo zusammen,

ich möchte ein DIV langsam mit opacity einblenden lassen.
Warum funzt mein folgender Code nicht, sondern die DIV wird einfach mit voller opacity zeitverzögert eingeblendet.

Wenn das auskommentierte alert(siehe function setOpacity(){...}) aber gesetzt ist,wird die DIV schrittweise eingeblendet!

Kann mir das jemand erklären bitte?

Ich danke im Voraus!

function setNewsVisibility (visible) {
  if(visible == true){
   document.getElementById('news').style.visibility = 'visible';
   setOpacity(0,100,25);
  }else{
   document.getElementById('news').style.visibility = 'hidden';
   setNewsOpacity(0);
  }
 }
 function setOpacity (from, to, cps){
  var timeout = 1000 / cps;
  var space = to - from;
  var opacitystep = space / cps;
  for (var i = 1; i <= cps; i++){
   var pasttimemillis=0;
   var currenttime = new Date();
   while(pasttimemillis < timeout){
    pasttimemillis = new Date() - currenttime;
   }
   //alert("Lauf: "+i+" "+pasttimemillis);
   setNewsOpacity(opacitystep * i);

}
 }
 function setNewsOpacity(opacity){
  document.getElementById('news').style["filter:alpha"] = "opacity="+opacity;
  document.getElementById('news').style["-moz-opacity"] = ""+(opacity/100);
  document.getElementById('news').style["opacity"] = ""+(opacity/100);
 }

  1. Hallo,

    Die Schleife(n) in der Funktion setOpacity blockier(t|en) vermutlich den Browser, der erst nach der Ausführung das Ergebnis zeigt. Du kannst das Problem lösen, indem du http://de.selfhtml.org/javascript/objekte/window.htm#set_timeout@title=setTimeout oder http://de.selfhtml.org/javascript/objekte/window.htm#set_interval@title=setInterval verwendest.

    Gruß

  2. Hallo,

    Ich habe einmal eine Codeschnipsel über das Abblenden einer Seite geschrieben. Dieser Artikel befasst sich zwar eigentlich mit dem Abdunkeln das Seite, aber da hierfür ein DIV benutzt wird, lässt es sich auch mit einem kleinen Umbau auf jedes andere DIV auf der Seite anwenden.

    Liebe Grüße
    Manko10