|
Trouver une ressource
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !
Sujet : Slideshow + lien [ CSS / Général ] (matix59)
Informations & options pour cette discussion
vendredi 18 juillet 2008 à 10:51:59 |
Slideshow + lien

matix59
|
bonjour à tous , j'ai un code pour faire un slideshow en javascript , le problème c'est que je ne sais pas comment ajouter un lien URL à chaque image. <script language="JavaScript1.2"> //Fade-in image slideshow- By Dynamic Drive //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com //This credit MUST stay intact for use var slideshow_width='730px' //SET IMAGE WIDTH var slideshow_height='170px' //SET IMAGE HEIGHT var pause=5000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) var fadeimages=new Array() //SET IMAGE PATHS. Extend or contract array as needed fadeimages[0]="http://img257.imageshack.us/img257/1958/admsonyjs6.jpg" fadeimages[1]="http://img141.imageshack.us/img141/9097/admnintendoil7.jpg" fadeimages[2]="adm_microsoft.jpg" ////NO need to edit beyond here///////////// var preloadedimages=new Array() for (p=0;p<fadeimages.length;p++){ preloadedimages[p]=new Image() preloadedimages[p].src=fadeimages[p] } var ie4=document.all var dom=document.getElementById if (ie4||dom) document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>') else document.write('<img name="defaultslide" src="'+fadeimages[0]+'">') var curpos=10 var degree=10 var curcanvas="canvas0" var curimageindex=0 var nextimageindex=1 function fadepic(){ if (curpos<100){ curpos+=10 if (tempobj.filters) tempobj.filters.alpha.opacity=curpos else if (tempobj.style.MozOpacity) tempobj.style.MozOpacity=curpos/100 } else{ clearInterval(dropslide) nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">' nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0 setTimeout("rotateimage()",pause) } } function rotateimage(){ if (ie4||dom){ resetit(curcanvas) var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.style.zIndex++ var temp='setInterval("fadepic()",50)' dropslide=eval(temp) curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" } else document.images.defaultslide.src=fadeimages[curimageindex] curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0 } function resetit(what){ curpos=10 var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) if (crossobj.filters) crossobj.filters.alpha.opacity=curpos else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=curpos/100 } function startit(){ var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">' rotateimage() } if (ie4||dom) window.onload=startit else setInterval("rotateimage()",pause) </script> |
|
En vous remerciant d'avance ,
|
|
|
vendredi 18 juillet 2008 à 11:06:00 |
Re : Slideshow + lien

Zobibol
|
Bien le bonjour, pour une fois du code y en a ;o)
voir en gras dans le source. <script language="JavaScript1.2"> //Fade-in image slideshow- By Dynamic Drive //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com //This credit MUST stay intact for use var slideshow_width='730px' //SET IMAGE WIDTH var slideshow_height='170px' //SET IMAGE HEIGHT var pause=5000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) var fadeimages=new Array() //SET IMAGE PATHS. Extend or contract array as needed fadeimages[0]="http://img257.imageshack.us/img257/1958/admsonyjs6.jpg" fadeimages[1]="http://img141.imageshack.us/img141/9097/admnintendoil7.jpg" fadeimages[2]="adm_microsoft.jpg"
// Définition des liens. // Le liens 0 est lié à l'image 0 et ainsi de suite. var linkImage = new Array(); linkImage[0] = "http://www.javascriptFr.com"; linkImage[1] = "http://www.google.com"; linkImage[2] = "http://www.yahoo.fr";
////NO need to edit beyond here///////////// var preloadedimages=new Array() for (p=0;p<fadeimages.length;p++){ preloadedimages[p]=new Image() preloadedimages[p].src=fadeimages[p] } var ie4=document.all var dom=document.getElementById if (ie4||dom) document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>') else document.write('<a href="'+linkImage[0]+'" ><img name="defaultslide" src="'+fadeimages[0]+'"></a>') var curpos=10 var degree=10 var curcanvas="canvas0" var curimageindex=0 var nextimageindex=1 function fadepic(){ if (curpos<100){ curpos+=10 if (tempobj.filters) tempobj.filters.alpha.opacity=curpos else if (tempobj.style.MozOpacity) tempobj.style.MozOpacity=curpos/100 } else{ clearInterval(dropslide) nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj.innerHTML='<a href="'+linkImage[nextimageindex]+'" ><img src="'+fadeimages[nextimageindex]+'"></a>' nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0 setTimeout("rotateimage()",pause) } } function rotateimage(){ if (ie4||dom){ resetit(curcanvas) var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.style.zIndex++ var temp='setInterval("fadepic()",50)' dropslide=eval(temp) curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" } else document.images.defaultslide.src=fadeimages[curimageindex] curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0 } function resetit(what){ curpos=10 var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) if (crossobj.filters) crossobj.filters.alpha.opacity=curpos else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=curpos/100 } function startit(){ var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML='<a href="'+linkImage[curimageindex]+'"><img src="'+fadeimages[curimageindex]+'"></a>' rotateimage() } if (ie4||dom) window.onload=startit else setInterval("rotateimage()",pause) </script>
et normalement ! ça doit être pas mal !
[o-_-o]
|
|
|
vendredi 18 juillet 2008 à 12:12:59 |
Re : Slideshow + lien

matix59
|
Un grand merci à toi de part ta rapidité et surtout de l'aide à insérer les liens.
Merci à toi
|
|
|
vendredi 18 juillet 2008 à 12:39:39 |
Re : Slideshow + lien

matix59
|
juste encore un petit truc , comment je peux faire pour enlever le contour du lien ( ligne bleue ) ?
|
|
|
vendredi 18 juillet 2008 à 12:45:14 |
Re : Slideshow + lien

Zobibol
|
utilise le style, j'avais pas percuter ce problème... un truc du genre <style> img{ border:0px; } </style>
devrait être amplement sufficant !
[o-_-o]
|
|
|
vendredi 18 juillet 2008 à 13:50:43 |
Re : Slideshow + lien

banbanfr
|
le px n'est pas obligatoire :)
img{border:0;}
|
|
|
vendredi 18 juillet 2008 à 14:05:13 |
Re : Slideshow + lien

matix59
|
merci beaucoup , tout fonctionne correctement.
merci
|
|
|
mercredi 3 décembre 2008 à 14:02:28 |
Re : Slideshow + lien

lolonaae
|
Petite contribution: Pour retirer le contour bleu du lien image il faut ajouter le code suivant : style="border:0" comme ci-dessous en gras:
<script language="JavaScript1.2"> //Fade-in image slideshow- By Dynamic Drive //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com //This credit MUST stay intact for use var slideshow_width='730px' //SET IMAGE WIDTH var slideshow_height='170px' //SET IMAGE HEIGHT var pause=5000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) var fadeimages=new Array() //SET IMAGE PATHS. Extend or contract array as needed fadeimages[0]="http://img257.imageshack.us/img257/1958/admsonyjs6.jpg" fadeimages[1]="http://img141.imageshack.us/img141/9097/admnintendoil7.jpg" fadeimages[2]="adm_microsoft.jpg"
// Définition des liens. // Le liens 0 est lié à l'image 0 et ainsi de suite. var linkImage = new Array(); linkImage[0] = "http://www.javascriptFr.com"; linkImage[1] = "http://www.google.com"; linkImage[2] = "http://www.yahoo.fr";
////NO need to edit beyond here///////////// var preloadedimages=new Array() for (p=0;p<fadeimages.length;p++){ preloadedimages[p]=new Image() preloadedimages[p].src=fadeimages[p] } var ie4=document.all var dom=document.getElementById if (ie4||dom) document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>') else document.write('<a href="'+linkImage[0]+'" ><img name="defaultslide" src="'+fadeimages[0]+'"></a>') var curpos=10 var degree=10 var curcanvas="canvas0" var curimageindex=0 var nextimageindex=1 function fadepic(){ if (curpos<100){ curpos+=10 if (tempobj.filters) tempobj.filters.alpha.opacity=curpos else if (tempobj.style.MozOpacity) tempobj.style.MozOpacity=curpos/100 } else{ clearInterval(dropslide) nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj.innerHTML='<a href="'+linkImage[nextimageindex]+'" ><img src="'+fadeimages[nextimageindex]+'" style="border:0"></a>' nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0 setTimeout("rotateimage()",pause) } } function rotateimage(){ if (ie4||dom){ resetit(curcanvas) var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.style.zIndex++ var temp='setInterval("fadepic()",50)' dropslide=eval(temp) curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" } else document.images.defaultslide.src=fadeimages[curimageindex] curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0 } function resetit(what){ curpos=10 var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) if (crossobj.filters) crossobj.filters.alpha.opacity=curpos else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=curpos/100 } function startit(){ var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML='<a href="'+linkImage[curimageindex]+'"><img src="'+fadeimages[curimageindex]+'" style="border:0"></a>' rotateimage() } if (ie4||dom) window.onload=startit else setInterval("rotateimage()",pause) </script>
|
|
|
Cette discussion est classé dans : var, document, crossobj, ie4, curcanvas
Répondre à ce message
Sujets en rapport avec ce message
pb compatibilité netscape 7 sur défilement texte et image [ par mozefoc ]
bonjour. j'utilise le script en dessous pour créer une zone dans laquelle je peux insérer texte/images/requetes php... cette zone est de largeure et d
script [ par thigat ]
voilà j'ai fais un script, mais je n'arrive pas a mettre un lien (url) dans ce script, voici le script :/* ATP - webmaster* Script - WebNet.News */va
probleme .js [ par mikedimoi ]
Salut!Je voudrais faire un fichier .js séparé.Voici ce que j'ai dans mon head:function fMike(){//------------------------------// variables declaratio
addition successive d'un champ de formulaire [ par Serialsiner ]
Bonjour,Je cherche à additionner des heures et minutes situées dans 2 champs différents et à afficher le résultat dans un troisième champ résultat.Le
Cookie : Aidez moi s'il vous plait [ par Gravity ]
Bonjour à tous !Je suis vraiment nul en Javascript... J'aurais aimé savoir comment ce code ci peut-être modifié ou alors, creer un nouveau code, pour
Calendrier Javascript incompatible mozilla!!! [ par jojomillenium ]
hello!Vala j'ai un bleme, mon calendrier marche nicke sous explorer mais sous mozilla rien a faire, il apparait pour le mois present, mais si je veux
Evènement onResize [ par initnocsib ]
Je souhaite afficher plus ou moins de photos dans un bandeau en fonction de la taille de la fenêtre. voici le code : if (document.body) { var larg =
Tableau 2D [ par malik7934 ]
Hello, En deux mots: j'ai fais ça: http://noisy.ch/smilies/smilies2.html mais je n'y connais rien à Javascript (c'est pour un chat en php). J'ai modi
Problème d'inscription ! [ par roxor666 ]
Svp je voudrais avoir un script, je sais qu'il existe mais je ne le trouve plus.LE but est que quand un gars s'inscrit sur mon site je recoit le pass
2 sources JScript [ par ProphetKy ]
Bonjour à tous, Voila j'ai un petit probleme avec mes script JavaScript lorsque j'en met deux il y a en a qui disparait. J'ai un Jscrip qui fait le
Livres en rapport
|
Téléchargements
Logiciels à télécharger sur le même thème :
|