// articolo e sorgente: http://clagnut.com/sandbox/imagefades/ function initImage(objId){ image = document.getElementById(objId); setOpacity(image, 0); image.style.visibility = 'visible'; fadeIn(objId,0); } function setOpacity(obj,opacity){ opacity=(opacity==100) ? 99.999 : opacity; obj.style.filter = "alpha(opacity:"+opacity+")"; // IE/Win obj.style.KHTMLOpacity = opacity/100; // Safari<1.2, Konqueror obj.style.MozOpacity = opacity/100; // Older Mozilla and Firefox obj.style.opacity = opacity/100; // Safari 1.2, newer Firefox and Mozilla, CSS3 } function fadeIn(objId,opacity){ if(!document.getElementById) return; obj = document.getElementById(objId); if(opacity <= 100){ setOpacity(obj,opacity); opacity += 10; window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100); } } //la temporarizzazione e l' opacità finale sono state leggermente cambiate function fadeOut(objId,opacity){ if(!document.getElementById) return; obj = document.getElementById(objId); if(opacity >= 30){ setOpacity(obj,opacity); opacity -= 10; window.setTimeout("fadeOut('"+objId+"',"+opacity+")", 50); } } //funzione aggiunta: fadeOut e fadeIn al passaggio del mouse function setFade(objId){ el=document.getElementById(objId); el.onmouseover=function(){fadeOut(objId,100)}; el.onmouseout=function(){fadeIn(objId,40)}; }