2009-08-03 8 views
2

J'essaie d'implémenter une galerie de style Lightbox en cliquant sur un lien texte pour lancer un diaporama d'images chargées à partir d'un tableau, et non du contenu en ligne de la page. Tous les exemples que je peux trouver utilisent un groupe d'images en ligne qui sont en quelque sorte liées (c'est-à-dire en utilisant une étiquette rel ou une classe). Je veux définir mes images en utilisant leurs chemins dans un tableau Javascript.jQuery Lightbox ou équivalent avec tableau d'images

Quelqu'un connaît la solution ou a des pointeurs? TIA.

Répondre

4

Les travaux suivants avec l'exemple, vous pouvez télécharger à partir du site plugin.

Démo here

$(function() { 
     $('#testLink').click(dynamicLightBoxinit); 
    }); 

    function dynamicLightBoxinit(){ 
     images = ["photos/image1.jpg", "photos/image2.jpg","photos/image3.jpg","photos/image4.jpg","photos/image5.jpg"]; 
     var imageBuilder=''; 
     for (var i = 0; i < images.length; i++) { 

      imageBuilder += '<a href="'+images[i]+'"><img src="'; 
      imageBuilder += images[i]; 
      imageBuilder += '" \></a>'; 
      } 

      var lb = $(imageBuilder); 
      lb.lightBox(); 
      lb.filter('a:first').click(); 
     } 
+0

Merci redsquare, fonctionne votre solution parfaitement et est exactement ce que je cherchais. À votre santé :) – da5id

0

Je ne sais pas exactement ce que vous recherchez, mais est-ce quelque chose que vous cherchez?

images = ["path1.jpg", "path2.jpg"]; 
for (var i = 0; i < images.length; i++) 
    { 
    var img = new Image(); 
    img.src = images[i]; 
    images[i] = img; 
    } 

Plutôt émoussée sur place remplacement des URLs aux objets-Image, mais il était plus court à écrire.

Vos images seront chargées par le navigateur lorsque l'attribut src est défini et peuvent être ajoutées à n'importe quel conteneur html par des opérations dom normales.

HTH.

Questions connexes