function setOpacity(id, opacity) {
    var obj = document.getElementById(id);
    if (! obj) return;

    var obj_style = obj.style;
    var op = opacity / 100.0;
    // W3C
    obj_style.opacity = op;
    // Old Mozila
    obj_style.MozOpacity = op;
    // KHTML and old WebKit
    obj_style.KhtmlOpacity = op;
    // MS-IE
    obj_style.filter = "alpha(opacity=" + opacity + ")";
}

function fadeIn(id, millisec) {
    var speed = Math.round (millisec / 100);
    for (var i = 0; i < 100; i++) {
        setTimeout("setOpacity('"+id+"',"+i+")", i * speed);
    }
}

function fadeOut(id, millisec) {
    var speed = Math.round (millisec / 100);
    for (var i = 0; i < 100; i++) {
        setTimeout('setOpacity("'+id+'",'+(100-i)+')',i*speed);
    }
}

function blendImages(div_id, img_id, image_file, millisec) {
    var div_obj = document.getElementById(div_id);
    if (! div_obj) return;
    var img_obj = document.getElementById(img_id);
    if (! img_obj) return;
    // set bg to "old image"
    div_obj.style.backgroundImage = img_obj.style.backgroundImage;
    // hide fg by setting opacity
    setOpacity(img_id,0);
    // set fg image.
    img_obj.style.backgroundImage = "url('"+image_file+"')";
    // fade in.
    fadeIn(img_id,millisec);
}
