Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1684 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Slide show : changer un lien href en meme temps que l'image affichée

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Slide show : changer un lien href en meme temps que l'image affichée

n°2048167
T2k
Posté le 11-01-2011 à 15:38:38  profilanswer
 

Salut à tous,
 
j'ai récupéré un petit script en JS pour faire un slide show sur des images.
Je l'ai juste adapté pour qu'il récupère les images que je souhaite : elles sont référencées dans une BDD.
 
En revanche, malgré m'etre bien penché dessus (mais je ne connais rien au JS ...), je n'arrive pas à modifier le script pour qu'il me change la valeur du HREF d'un lien - voir plus bas en gras - (qui sont également stockées  dans une BDD, avec le nom des images).
 
Le script original qui fait défiler UNIQUEMENT les images :

Code :
  1. <script type="text/javascript">
  2. <?php echo 'tbimage=new Array(\''.$image_bdd_1.'\',\''.$image_bdd_2.'\',\''.$image_bdd_3.'\',\''.$image_bdd_4.'\',\''.$image_bdd_5.'\',\''.$image_bdd_6.'\')'; ?>
  3. preImages=new Array;
  4. var opaa=0;
  5. var opab=100;
  6. var compteur=2;
  7. var vitesse=5000;
  8. function precharge()
  9. {
  10. for (i = 0; i < tbimage.length; i++)
  11. {
  12.  preImages[i] = new Image();
  13.  preImages[i].src = 'images/'+tbimage[i]+'';
  14. }
  15. setTimeout(defilmage,vitesse);
  16. }
  17. function defilmage(reg)
  18. {
  19. oxo=reg;
  20. if(compteur==tbimage.length-1)
  21. {
  22.  compteur=-1;
  23. }
  24. if(oxo==1)
  25. {
  26.  compteur++;
  27.  opaa=10;
  28.  document.getElementById('divimageb').src="images/"+tbimage[compteur]+"";
  29.  oxo=0;
  30. }
  31. var imacibleb=document.getElementById('divimagea');
  32. var imaciblea=document.getElementById('divimageb');
  33. opaa+=3;
  34. opab-=4;
  35. if(document.all && !window.opera)
  36. {
  37.  imaciblea.style.filter = 'alpha(opacity=' + opaa + ');';
  38.  imacibleb.style.filter = 'alpha(opacity=' + opab + ');';
  39. }
  40. else
  41. {
  42.  imaciblea.style.opacity = opaa/100;
  43.  imacibleb.style.opacity = opab/100;
  44. }
  45. if(opaa>=100)
  46. {
  47.  opaa=10;
  48.  opab=100;
  49.  var xcc=imaciblea.src.length-4;
  50.  var cxx=imaciblea.src.lastIndexOf("/" )+1;
  51.  var nomimg=imaciblea.src.substring(cxx,xcc);
  52.  imacibleb.src='images/'+nomimg+'';
  53.  setTimeout("defilmage(1)",vitesse);;
  54.  return false;
  55. }
  56. setTimeout("defilmage()",25);
  57. }
  58. if(navigator.appName.substring(0,3)=="Mic" )
  59. {
  60. attachEvent("onload",precharge);
  61. }
  62. else
  63. {
  64. addEventListener("load", precharge, false);
  65. }
  66. </script>


 
L'affichage :
 
<div style="position:relative;top:-110px;left:0px;"><a href="index.php?page=xxx">
<img alt="" id="divimagea" src="images/<?php echo $image_bdd_1; ?>" style="border:0px none;position:absolute;top:0px;left:0px;width:950px;height:220px;opacity:100;FILTER:alpha(opacity=100);" />
<img alt="" id="divimageb" src="images/<?php echo $image_bdd_2; ?>" style="border:0px none;position:absolute;top:0px;left:0px;width:950px;height:220px;opacity:0;FILTER:alpha(opacity=0);" />
</a></div>
 
J'imagine qu'il faut créer un tableau, comme cela a été fait avec les images, et de faire défiler sa valeur (du style : $url_bdd_1, ... etc) en même temps que le nom des images ($image_bdd_1, ... etc).
 
Merci de votre aide pour me mettre sur la voie !  :hello:


Message édité par T2k le 13-01-2011 à 14:39:24
mood
Publicité
Posté le 11-01-2011 à 15:38:38  profilanswer
 

n°2048198
aspirateur
Posté le 11-01-2011 à 16:50:04  profilanswer
 

Heu à mon avis il manque un truc, je vois pas de référence au lien.
 
Tu l'as pris ou ton slideshow ?

n°2048631
T2k
Posté le 13-01-2011 à 11:21:55  profilanswer
 

Justement, il n'y en a pas !
Heu je me souviens plus du tout ca fait un moment que j'ai pris ce script

n°2048701
T2k
Posté le 13-01-2011 à 14:41:44  profilanswer
 

Personne ne vois comment adapté ce script alors ? :/
J'imagine ce qu'il faut faire
-récupérer les urls (stockées dans la BDD avec le nom des images)
-faire défiler la valeur du lien en meme temps que l'images
-et changer le href du lien
 
mais niveau code, je vois pas du tout (connait rien au JS)
 
Help me plz :s

n°2048722
GordonF_69
Posté le 13-01-2011 à 15:40:16  profilanswer
 

Bon j'ai pas trop lu le script, mais ce que je ferai :
Je donne un "id" a la balise <a>
 
<a id="balise_le_lien" href="index.php?page=xxx"> ..blabla ... image.... </a>
 
Apres je modifie le lien en JS :
 
document.getElementById("balise_le_lien" ).href="nouvelle_url";

n°2050230
T2k
Posté le 19-01-2011 à 15:00:21  profilanswer
 

C'est ce que je me disais, mais j'ai pas réussi à le faire !
 
En gros il y a un array avec 6 valeurs (pour le nom de mes images), et un compteur pour savoir où l'on se trouve
Mais je vois comment intégrer la même chose dans ce script pour changer la valeur du href de mon lien en même temps :/


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Slide show : changer un lien href en meme temps que l'image affichée

 

Sujets relatifs
Changer la couleur d'un bouton JQuery mobileEstimation de temps pour applications
fade in simple sur une seule image d'accueilDétecter la définition d'une image
Problème de lien html -> phpChanger la couleur d'une JFrame
Changer le design de l'appli en JAVAafficher un lien dans un cadre avec dreamweaver
intégrer image dans commentaireRécupérer les coordonnées de clic sur image
Plus de sujets relatifs à : Slide show : changer un lien href en meme temps que l'image affichée


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR