Soyez le premier à donner votre avis sur cette source.
Vue 51 462 fois - Téléchargée 5 087 fois
<HTML> <HEAD> <TITLE>Fondu de plusieurs images</TITLE> <!-- On déclare le code source --> <SCRIPT LANGUAGE="JavaScript"> <!-- // mettre un minimum de 4 images !!! var coef = 0.05 ; // avancement de l'opacité var temps = 50 ; // temps entre chaque changement d'opacité var temps_pause = 2000 ; // temps d'attente entre 2 changements d'images var nombre_image = 5 ; // nombre d'images a faire bouger var prefix_image = 'gfx/'; // chemin + prefix du nom des images var suffix_image = '.jpg' ; // suffix + '.extension' du nom des images // pas touche var indice = 2; // les 2 premiere image sont deja charger dans le HTML, on commence a la 3eme var isIE = navigator.userAgent.toLowerCase().indexOf('msie')!=-1 ; var img1 = null; var img2 = null ; var sens = 1; var tabImg; // tab contenant les images function prechargerImg(){ tabImg = new Array(nombre_image); for (i=0; i<=nombre_image -1; i++){ tabImg[i]=new Image(); tabImg[i].src = prefix_image+(i+1)+suffix_image; } } function init() { img1 = document.getElementById("defilement1") ; img2 = document.getElementById("defilement2") ; prechargerImg(); change_opacity(); } function change_opacity() { var opacity1 = 0 ; var opacity2 = 0 ; if (isIE) // for IE { opacity1 = parseFloat(img1.filters.alpha.opacity); opacity2 = parseFloat(img2.filters.alpha.opacity); } else // for mozilla { opacity1 = parseFloat(img1.style.MozOpacity); opacity2 = parseFloat(img2.style.MozOpacity); } if (sens) { if (isIE) // for IE { img1.filters.alpha.opacity = opacity1 + coef * 100; img2.filters.alpha.opacity = opacity2 - coef * 100; } else // for Mozilla { img1.style.MozOpacity = opacity1 + coef; img2.style.MozOpacity = opacity2 - coef; } } else { if (isIE) // for IE { img1.filters.alpha.opacity = opacity1 - coef * 100; img2.filters.alpha.opacity = opacity2 + coef * 100; } else // for Mozilla { img1.style.MozOpacity = opacity1 - coef; img2.style.MozOpacity = opacity2 + coef; } } if (isIE) // for IE { opacity1 = parseFloat(img1.filters.alpha.opacity); opacity2 = parseFloat(img2.filters.alpha.opacity); } else // for mozilla { opacity1 = parseFloat(img1.style.MozOpacity); opacity2 = parseFloat(img2.style.MozOpacity); } // on fait varié le sens d'opacité du bazar if (opacity2 <= 0) { img2.src=tabImg[indice++].src; sens = 0; if (indice == (tabImg.length)) indice=0; window.setTimeout("change_opacity()",temps_pause) ; // attente return 0; } else if (opacity1 <= 0) { img1.src=tabImg[indice++].src; sens = 1; if (indice == (tabImg.length)) indice=0; window.setTimeout("change_opacity()",temps_pause) ; // attente return 0; } window.setTimeout("change_opacity()",temps) ; // recursion toutes les x millisec } --> </SCRIPT> </HEAD> <!-- On charge le script et les images --> <BODY onload="init();"> <!-- Premiere image id=defilement1 --> <img id="defilement1" src="gfx/1.jpg" style="-moz-opacity:0;filter:alpha(opacity=0);margin-bottom:10px;"> <!-- Deuxieme image id=defilement2 /!\ positionnée RELATIVEMENT par rapport à la 1ère pour qu'elles se superposent /!\ --> <img id="defilement2" src="gfx/2.jpg" style="-moz-opacity:1;filter:alpha(opacity=100);position:relative;top:-10px;left:-174px;"> </BODY> </HTML>
L'image s'ouvre dans une nouvelle fenêtre mais c'est tout...
Descend sur le menu déroulant "archives".
Sur "classés par mois", choisis 'juin 2010'
Tu retrouveras la photo dont je t'ai parlé ainsi que 4 affiches que l'on peut aggrandir.
Voilà la fonction javascript utilisée :
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
Voilà le HTML :
[#
]
Va sur le site www.saint-avertin-sports.com.
Dans la deuxième colonne, en bas il y a la photo de M. C. FILOU.
Quand tu cliques dessus, la photo est agrandie, et tu peux refermer la fenêtre pour revenir à la page d'accueil.
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.