Plynulé zobrazení obrázku - rozporcování style.cssText

    element.style.cssText = "opacity: " + o + "; filter: alpha(opacity=" + of + "); -moz-opacity: " + o + "; -khtml-opacity: " + o + "; ";

element.style.opacity = o;

javascript:document.body.style.opacity=0.5;void 0;

selektor {
  vlastnost:hodnota;
  vlastnost:hodnota;
}

function zobrazit(co)
{
  var obr = document.getElementById(co), krok = 0.05, o = krok;
  for(var i = krok; i <= 1; i += krok)
  {
    setTimeout(krokAnimace, i * 600);
  }
  function krokAnimace()
  {
    var of = Math.round((o) * 100);
    obr.style.cssText = "opacity: " + o + "; filter: alpha(opacity=" + of + "); -moz-opacity: " + o + "; -khtml-opacity: " + o + "; ";
    o += krok;
  }
}

var obr = document.getElementById(co); var krok = 0.05; var o = krok;

var setOpacity;
if(isIE) {
  setOpacity = function(element, opacity) {
    if(typeof element != "object" || typeof opacity != "number" || opacity < 0 || opacity > 100) return false;
    if(typeof element.style != "object") return false;
    if(element.style.cssText == void(0)) return false;
    var cssText = element.style.cssText.split(";");
    var found = false;
    var lowercase;
    for(var index=0;index<cssText.length;index++) {
      lowercase = cssText[index].toLowerCase();
      if(lowercase.indexOf("filter:") > -1) {
        if(lowercase.indexOf("progid:dximagetransform.microsoft.alpha") > -1) found = true;
        break;
      }
    }
    if(found) {
      var index2 = cssText[index].toLowerCase().indexOf("progid:dximagetransform.microsoft.alpha");
      var index3 = index2 + cssText[index].substr(index2).indexOf(")") + 1;
      if(opacity!=100) cssText[index] = cssText[index].substr(0,index2+39) + "(opacity = " + String(opacity) + ")" + cssText[index].substr(index3);
      else {
        if(regexp.test(cssText[index].substr(index3)) || regexp.test(lowercase.substr(index3).replace("filter:",""))) cssText[index] = cssText[index].substr(0,index2) + cssText[index].substr(index3);
        else cssText[index] = "";
      }
      element.style.cssText = cssText.join(";");
    } else if(opacity!=100) {
      element.style.filter += "progid:DXImageTransform.Microsoft.Alpha(opacity = " + String(opacity) + ")";
    }
    return true;
  }
} else {
  setOpacity = function(element, opacity) {
    if(typeof element != "object" || typeof opacity != "number" || opacity < 0 || opacity > 100) return false;
    if(typeof element.style != "object") return false;
    element.style.opacity = opacity==100?"":opacity / 100;
    return true;
  }
}

function retransparent(objectID,time,transparency_start,transparency_end,callback) {
  if(typeof objectID != "object") objectID = document.getElementById(objectID);
  if(!objectID) {
      if(typeof callback == "function") callback();
      return function() {}
    }
  var calls = [];
  var ticks = Math.round(time / (1000 / FramesPerSecond));
  var delta = transparency_end - transparency_start;
  var diff = delta / ticks;
  var previous;
  if(PerformanceSaver) previous = false;
  for(var index = 0; index <= ticks; index++) {
    if(!PerformanceSaver || Math.floor(transparency_start+(index*diff)) !== previous || index == ticks) {
      (function(index){
        calls.push(window.setTimeout(function() {
          var opacity;
          if(index == ticks) opacity = transparency_end;
          else opacity = transparency_start+(index*diff);
          if(opacity > 0) {
            setOpacity(objectID, opacity);
            if(isHidden(objectID)) show(objectID);
          } else {
            setOpacity(objectID, opacity);
            if(isShown(objectID)) hide(objectID);
          }
          if(index == ticks && typeof callback == "function") {callback();}
        },index*(1000 / FramesPerSecond)));
      })(index);
      if(PerformanceSaver) previous = Math.floor(transparency_start+(index*diff));
    }
  }
  return function() {
    for(var count = 0; count < calls.length; count++) {
      clearTimeout(calls[count]);
    }
  }
}

/* PerformanceSaver: When turned off, the opacity changes every 1000 / FramesPerSecond milliseconds
which makes the animations as real as possible, but is pretty demanding regarding the browser resources.

When turned on, opacity only changes when the opacity change exceeds 1% - the human eye won't notice.
Also when turned on, the FPS settings affects mostly just the really fast animations, slow
animations are affected by the Performance saver which makes the set FPS value insignificant,
because the opacity doesn't get refreshed until the difference exceeds 1%. 

Retransparent document.body, transparency: 0 - 100, 30 seconds:
  PerformanceSaver off: 750 calls, 301.618ms total time
  PerformanceSaver on: 100 calls, 44.155ms total time

Approximately 86.18% of the previously needed performance saved. The slower animation, the more significant. */

/* Prvně se deklarují konstanty (isIE se může vyhodit a deklarovat přímo před funkcí, jelikož se použije jen jednorázově při načítání) */
var FramesPerSecond = 60, /* Počet snímků za sekundu, počítá se z něj čas jednotlivých timeoutů */
    isIE = "\v" == "v", /* Proměnná, která indikuje, jde-li o Internet Explorer, aby se nemusel složitě parsovat cssText v ostatních prohlížečích */
    PerformanceSaver = true; /* Vysvětleno v postu #13, při true se mění opacity jen pokud změna přesahuje jedno procento. Šetří výkon. */

/* Sem přijdou deklarace z postu #13 */

retransparent(/*
  obrázek (buďto ID daného obrázku nebo rovnou pointer na objekt),
  čas animace (v milisekundách),
  počáteční opacity (0),
  konečná opacity (100),
  funkce která se zavolá po dokončení animace (function() {alert("Milí návštěvníci, právě jste byli svědky mé úžasné animace. Jistě jste tak nadšeni jako já!");})
*/); /* Funkce navrátí funkci, která po zavolání animaci přeruší */