FONDU D'IMAGE

Commentaire de proftnj le 31/07/2006 14:59:37

Avec moi, ça ne fonctionne pas du tout, ni avec IE, ni avec FF. J'ai fermé le balise "script", mais l'image est visible dès le chargement de la page et ne disparaît pas si je clique dessus. J'ai effectué un copier-coller du code dans le bloc-note. Y a-t-il quelque chose à changer?

Commentaire de dylan_salmon le 31/07/2006 20:21:40

oui il faut que tu déclares dans la balise sur laquelle tu veux faire un fondu l'opacité par défaut de ton image sinon tu auras une erreur.

j'ai retesté, et y'a pas de problème, ça fonctionne sur FF et IE

(l'image apparait au début... cliquez sur l'image pour la faire disparaitre et repasser à l'endroit de l'image pour la faire réapparaitre)

Bonne soirée !!

Commentaire de proftnj le 31/07/2006 21:20:10

Les effets de filtres ne font pas partie des recommandations du W3C.
"cur.filters.alpha.opacity" est une fonction spécifique de IE 6;
"-moz-opacity" est une fonction spécifique de mozilla et de son clone Firefox.
Probable que ce script ne donne rien avec Opéra, Safari,... et peut-être même Netscape.
Tant que ça ne plante rien, il n'y a pas de problème.

Commentaire de atiladiffusion le 17/10/2006 00:08:54

Par contre moi j'aimerai bien voir le code de ta map, car oi j'ai besoin de mettre plussieurs images, et que lorsque l'on clik sur le numéro de l'image que l'on veut afficher, l'ancienne disparaisse et la nouvelle apparait..
Tu peux montrer le code?

Commentaire de atiladiffusion le 17/10/2006 22:49:16

Bonsoir, y a t'il un moyen de le faire marcher dans Safari?
Si ce n'est pas possible comment faire pour faire juste apparaitre les images sans effet au moins.

Merci d'avance

Commentaire de atiladiffusion le 17/10/2006 23:08:29

Pourtant j'ai trouvé ca:
-khtml-opacity: 0.5; /* Safari */
ici
http://forum.alsacreations.com/topic-5-2063-1-Opacit--compatible-multi-navigateur-.html

coment faire pour que si ce n'est pas le bon navig il fait apparaitre sans effet les images.
c'est pas possible à partir de ton script?

Commentaire de proftnj le 17/10/2006 23:16:32

Aha! -khtml-opacity: 0.5; existe pour Safari!
Je retire ce que j'ai écrit plus haut! Merci pour l'info.
Et Opera, alors? Et les autres navigateurs?
C'est énervant!
dylan_salmon pourrait peut-être compléter son script (moi, j'en suis incapable), Il y aurait compatibilité avec IE, FF et Safari: cela fonctionnerait pour plus de 95 % des internautes, non?

Commentaire de atiladiffusion le 17/10/2006 23:20:50

il faut peut etre se diriger vers ca...

function SetOpacity(elmt, opacity){

  if(elmt.filters){

    elmt.filters.alpha.opacity=opacity

  }else{

    elmt.style.setProperty("-moz-opacity", opacity/100, "");

    elmt.style.setProperty("-khtml-opacity", opacity/100, "");

    elmt.style.setProperty("opacity", opacity/100, "");

  }

Commentaire de atiladiffusion le 18/10/2006 00:09:03

j'en suis là, mais ca marche toujours pas... sous mac=safari
-------------------------------------------

function visible(){
vitesseIE=1;
vitesseFF=60;
if(document.getElementById) {
cur=document.getElementById("imageID");
if(document.all){
cur.filters.alpha.opacity+=parseFloat(3);
if (cur.filters.alpha.opacity==100)
return;
else
setTimeout("visible()",vitesseIE);

}
else{
/*i=parseFloat(cur.style.getPropertyValue("-moz-opacity"));test pour safari*/
i=parseFloat(cur.style.getPropertyValue("-khtml-opacity"));
i+=parseFloat(0.1);
/*cur.style.setProperty("-moz-opacity", i, "");test pour safari*/
cur.style.setProperty("-khtml-opacity", i, "");
if (i>=1)
return;
else
setTimeout("visible()",vitesseFF);
}
}
}
function invisible(index){
vitesseIE=1;
vitesseFF=60;

if(document.getElementById) {
cur=document.getElementById("imageID");

if(document.all){
if (index=="1"){
cur.filters.alpha.opacity=100;
}
cur.filters.alpha.opacity-=parseFloat(3);
if (cur.filters.alpha.opacity==0){
document.getElementById("imageID").src=document.getElementById("imageID").src2;
visible();
return;
}
else {
setTimeout("invisible('0')",vitesseIE);
}

}
else{
if (index=="1"){
/*cur.style.setProperty("-moz-opacity", 1, "");test pour safari*/
cur.style.setProperty("-khtml-opacity", 1, "");
}
/*i=parseFloat(cur.style.getPropertyValue("-moz-opacity"));test pour safari*/
i=parseFloat(cur.style.getPropertyValue("-khtml-opacity"));
i-=parseFloat(0.1);
/*cur.style.setProperty("-moz-opacity", i, "");test pour safari*/
cur.style.setProperty("-khtml-opacity", i, "");
if (i<=0){
document.getElementById("imageID").src=document.getElementById("imageID").src2;
visible();
return;
}
else {
setTimeout("invisible('0')",vitesseFF);

}
}
}
}

function afficher_image(index,image){
for (i=1;i<5;i++)
document.getElementById(i).src=img_non_select.src;
document.getElementById(index).src=img_select.src;

document.getElementById("imageID").src2=image;
if (navigator.appName=="Opera"){
document.getElementById("imageID").src=image;
}else{
invisible('1');
}

}

function plus(){
for (i=1;i<5;i++){
if (document.getElementById(i).src==img_select.src){
i++;
if (i<=4)
afficher_image(i,eval ("i"+i+".src"));
return;
}
}
}

function moins(){
for (i=1;i<5;i++){
if (document.getElementById(i).src==img_select.src){
i--;
if (i>=1)
afficher_image(i,eval ("i"+i+".src"));
return;
}
}
}