Le plugin Thickbox

Version imprimable

Le plugin Thickbox

bonjour à tous;
je suis en train de développer un tableau contenant des liens qui affichent des photos (récupérées depuis le serveur), pour ce la, j'ai utilisé le plugin thickbox, voici le code d'une cellule de mon tableau:
Code:

1 2 3 <td> <a href="images/2010.graphe/temperature/07/ABZH.jpg" title="Hitorique" class="thickbox"><img src="images/buton_on.png" alt="Afficher"/></a> </td>
pour cela ça marche bien,
mon problème est dans l'actualisation de mon tableau en utilisant ajax, en fait, Le plugin Thickbox ne sera pas utilisé et mes photos s'affichent dans des nouvelles fenêtres, voici le code d'une cellule de mon tableau (en js):
Code:

1 2 3 4 5 6 7 8 9 var lienPhoto = document.createElement("A"); lienPhoto.href = "images/2010.graphe/temperature/07/ABZH.jpg"; lienPhoto.titre = "Hitorique"; lienPhoto.class="thickbox"; var image1 = document.createElement("IMG"); image1.src = "images/buton_on.png"; image1.alt = "Afficher"; lienPhoto.appendChild(image1); td12.appendChild(lienPhoto);
je vous suis reconnaissont pour toute solution proposée,:ccool:
merci d'avance.

20/07/2010, 12h38
emmanuel.remy

Salut,

L'attribut qui permet de modifier une class d'un élément est className (je ne dis pas que cela va tout faire fonctionner, mais c'est un début ;)

Code:

lienPhoto.className="thickbox";

ERE
20/07/2010, 12h45
dev2010

salut Emmanue,
merci pour ton aide, mais malheureusement j'ai déjà fait ça, et ça ne fonctionne pas , la classe "thickbox" n'était pas utilisé, et mes photos s'affichent encore dans des nouvelles pages,
merci encore.
20/07/2010, 13h18
Bovino

Lorsque tu lances le script de la thickbox, celui-ci affecte aux éléments présents dans la page un comportement spécifique.
Lorsque tu ajoutes des éléments à ta page via AJAX, ceux-ci ne peuvent pas être inclus dans un script lancé avant !
Il faut donc relancer le script de la thickbox, si possible uniquement sur les nouveaux éléments (au pire, sur toute la page).

bonjour Bovino,
voici le script utilisé pour implémenter le plugin thickbox:

Code:

1
2
3
4
5
6
7
8
9
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/thickbox.js"></script> 
 
<style type="text/css" media="all">@import "thickbox.css";</style>   ou
<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
 
<td>
 <a href="images/2010.graphe/temperature/07/ABZH.jpg" title="Hitorique" class="thickbox"><img src="images/buton_on.png" alt="Afficher"/></a>
</td>

comment peut on relancer ce script sur les nouveaux éléments crées via ajax?
j'ai essayé d'ajouter ça:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var script1 = document.createElement("script");
  script1.type = "text/javascript";
  script1.scr = "js/jquery.js";
 
  var script2 = document.createElement("script");
  script2.type = "text/javascript";
  script2.scr = "js/thickbox.js";
 
  var link = document.createElement("link");
  link.rel = "stylesheet";
  link.href = "thickbox.css";
  link.type = "text/css";
  link.media = "screen";
   ...
 
  tbl.appendChild(script1); // tbl: c'est le nouveau tableau crée via ajax
  tbl.appendChild(script2);
  tbl.appendChild(link);

mais ça ne fonctionne pas,:calim2:
merci d'avance.

20/07/2010, 17h10
dev2010

bonjour à tous,
bon j'ai trouvé une solution à mon problème, basé sur l'idée proposé par Bovino, et c'est d'ajouté ce code:
$.getScript("js/thickbox.js");
qui fait recharger le script de la thickbox.
bonne chance.
22/07/2010, 09h56
emmanuel.remy

Salut,

Cette solution fonctionne peut-être, mais crois tu qu'il soit raisonnable de recharger le script à chaque ajout/suppression d'image ?

ERE
26/07/2010, 10h56
dev2010

bonjour,
le script sera relancé en rechargeant le tableau via ajax.