Mettre des liens sur images par une commande javascript

Bonjour,
J'utilise un script (javascript) trouvé sur internet pour faire tourner un diaporama assez sympa, mais je voudrais ajouter un lien par image ouvrant une page/image agrandie (dans la même page).

En gros, le script contient une banque d'image sous forme :


<script language="javascript">

var implay = new Array;
var nume=0;
implay[0] = "zi/b_rf_003_renne.jpg";
implay[1] = "zi/b_rf_004_boeuf_musque.jpg";
implay[2] = "zi/b_rf_001_renard_polaire.jpg";
implay[3] = "zi/b_rf_002_cheval-przewalski.jpg";
implay[etc.] = "..................etc.jpg";
//tableau contenant les images
//numéro de l'image jouée

type="text/javascript">


Les mêmes images tournent sur plusieurs diaporamas (les uns décalés par rapport aux autres donnent un effet de bandeau défilant, en plus esthétique)

Donc je voudrais une solution me permettant d'ajouter un lien sur chaque image, et que ce lien fonctionne dans tous les diaporamas. Le tout en javascript.


Merci de votre aide ;-]]

En fait, avec beaucoup d'aide, j'ai fini par avoir le code adéquate :


<script language="javascript">
var num = 0; //numero de l'image jouee
//-- tableau contenant les images
var imagesTodisplay = new Array();
imagesTodisplay[0] = "zi/b_rf_001_renard_polaire.jpg";
imagesTodisplay[1] = "zi/b_rf_002_cheval-przewalski.jpg";
imagesTodisplay[2] = "zi/b_rf_003_renne.jpg";
imagesTodisplay[3] = "zi/b_rf_004_boeuf_musque.jpg";
//--tableau contenant les URL
var URL_ToDisplay = new Array();
URL_ToDisplay[0] = "zoomfaune001_renard_polaire_alopex_lagopus.html";
URL_ToDisplay[1] = "zoomfaune002_cheval_przewalski_equus_przewalskii.html";
URL_ToDisplay[2] = "zoomfaune003_renne_caribou_rangifer_tarandus.html";
URL_ToDisplay[3] = "zoomfaune004_boeuf_musque_ovibos_moschatus.html";
//Ajout d'un compte a rebours afin de jouer le diaporama
var timer_diapo = setInterval("diaporama('boite_diapo','img_diapo',500)", 1000);
//Fonction qui permet de jouer le diaporama
function diaporama(divid, imageid, millisec) {
var speed = Math.round(millisec / 100);
var timer = 0;

var O_Div = document.getElementById(divid);
var szLien = URL_ToDisplay ;
var szImage = imagesTodisplay ;
O_Div.style.backgroundImage = "url(" + szImage + ")";
//-- c'est ici que tu mets ce que tu fais sur le onclick
O_Div.onclick = function() {
mouse.open(szLien)
}
changeOpac(0, imageid);
if (num > (imagesTodisplay.length - 2)) {
num = -1;
}
document.getElementById(imageid).style.backgroundImage = "url(" + imagesTodisplay[num + 1] + ")";
for (i = 0; i <= 100; i++) {
setTimeout("changeOpac(" + i + ",'" + imageid + "')", (timer * speed));
timer++;
}
num++;
}
//Fonction qui attribue l'opacite a l'objet "image_diapo"
function changeOpac(opacity, id) {
var object = document.getElementById(id).style;
object.opacity = (opacity / 100);
object.MozOpacity = (opacity / 100);
object.KhtmlOpacity = (opacity / 100);
object.filter = "alpha(opacity=" + opacity + ")";
}
</script>


LA chose est qu'en l'état, les leins ouvrent sur de nouvelles pages, avec onclick=windox.open, et que je n'arrive pas à mettre la main sur la commande onclick=window.truc qui me permette d'ouvrir ces liens dans la même page...

Merci de votre aide

Ps. les X num affichés ici sont des num entre crochets []

feldrik a écrit :
En fait, avec beaucoup d'aide, j'ai fini par avoir le code adéquate :


(...)
LA chose est qu'en l'état, les leins ouvrent sur de nouvelles pages, avec onclick=windox.open, et que je n'arrive pas à mettre la main sur la commande onclick=window.truc qui me permette d'ouvrir ces liens dans la même page...

Merci de votre aide

Ps. les X num affichés ici sont des num entre crochets []

Il s'agit de window.location... mais pense à faire en sorte que ton diaporama soit disponible même quand JavaScript est désactivé...

Bonjour, merci de ton aide, j'ai essayé ça :

[#] var O_Div = document.getElementById(divid);
var szLien = URL_ToDisplay ;
var szImage = imagesTodisplay ;
O_Div.style.backgroundImage = "url(" + szImage + ")";
//-- c'est ici que tu mets ce que tu fais sur le onclick
O_Div.onclick = function() {
window.location(szLien)
}
et ça ne marche pas... Pas plus qu'avec window.top.location (qui n'est exactement ce que je veux), qu'avec window.self.location.

Je ne comprends pas ce qui cloche... Alors qu'avec window.open, pas de souci, il m'ouvre le lien dans la nouvelle page.

location n'est pas une méthode, mais une propriété de window

Oui, je viens de voir la différence entre méthode, propriété et sous-objet sur un tutoriel, mais je ne vois pas encore comment me dépatouiller avec ça. Je commence tout juste à me pencher sur le javascript !
En clair, je ne vois pas où intégrer la propriété location à l'objet window...

Il te suffit d'écrire window.location=szLien .

Il y a beaucoup de tutos sur le Web. N'hésite pas à te plonger dedans et à expérimenter avant de te lancer dans des développements... mais choisis ceux qui sont récents (on va dire datant au plus tard de 2006...), car la manière de concevoir du code javascript a rapidement évolué depuis quelques années.

Merci beaucoup de ton aide, j'avoue que je me noie un peu dans la foule de tutoriels, surtout quand je suis à la recherche d'une réponse très précise, comme ici. Après quelques tatonnements, je venais de trouver ce code :
O_Div.onclick = function() { window.location.assign(szLien); }

qui semblait aussi vouloir fonctionner...

Merci !
mais pense à faire en sorte que ton diaporama soit disponible même quand JavaScript est désactivé...

Tu me précisais ça, tout à l'heure, comment s'y prendre ?

Hello,

Est-ce que tu cherches à ouvrir l'image dans la même page (donc, qui remplace la page actuelle), ou bien l'ouvrir au sein de la même page (avec un effet du genre lightbox) ?

Pour que le diaporama fonctionne avec Javascript, il suffit que les images soient toutes présentes dans le code HTML, et placées dans des liens de manière à ce que quand on clique dessus, la page de leur description apparaisse. Ensuite, au chargement de la page, tu les fais disparaître avec ton javascript et mettes en place le diaporama...

Merci Gilles de ta réponse, concernant la mise à disposition du diaporama en cas de désactivation du javascript, mais je débute dans le codage, et je ne vois pas comment faire (est-ce indispensable ? Dans quelles circonstances un javascript "client" est désactivé ?).
Pour le moment, j'ai un diaporama qui tourne sur ie7 et ff3.0.4. Je l'ai monté sur une page orpheline, visible à cette adresse : http://www.feldrik-rivat-illustrateur.fr/zzztest_Copie_de_liens_diaporama_javascript.html

Si je comprends bien, un diaporama qui ne fonctionne pas laisserait juste un bandeau statique en haut de page ?