Sto realizzando un sito che presenta alcuni effetti fade, gestiti con semplici javascript che agiscono sui CSS. Adesso, il problema è il seguente: con Firefox, Chrome e Safari nessun problema, mentre con IE9 l'effetto funziona ma il valore opacity torna immediatamente a zero se vi si passa sopra con il mouse
Sito: http://www.pakepa.com/volpi
Css
#container div.slideshow img {
position: absolute;
margin-top: 30px;
width: 560px;
margin-left: -280px;
left: 50%;
filter: alpha(opacity=0);
opacity: 0.0;
}
Javascript (recuperati su internet e ritoccati)
function setOpacity(id, opacity) {
var element = document.getElementById(id);
if(document.all) {
element.style.filter = "alpha(opacity=" + opacity + ")";
} else {
element.style.opacity = opacity / 100;
}
}
function start(immagine) {
var speed = Math.round(1500 / 100);
var frame = 0;
for(fade = 0; fade < 100; fade++) {
setTimeout("setOpacity('"+immagine+"', "+fade+")", (speed * frame));
frame++;
}
}
function stop(immagine) {
var speed = Math.round(800 / 100);
var frame = 0;
for(fade = 100; fade > 0; fade--) {
setTimeout("setOpacity('"+immagine+"', "+fade+")", (speed * frame));
frame++;
}
}
Non so più dove sbattere la testa...
