2013-01-20 4 views
-2

J'utilise ce script https://stackoverflow.com/a/8855410/1055987 sur mon site, mais je veux éditer cela et je ne sais pas comment. Je veux écrire des images de la base de données que je ne veux pas écrire comme ceci, c'est possible? La fancybox normale ajoute juste rel = "groupe", mais il ne fonctionne pas. Avez-vous des solutions s'il vous plaît?Fancybox iframe modifier

[ 
{href:'images/01.jpg', title: '01'}, 
{href:'images/02.jpg', title: '02'}, 
{href:'images/03.jpg', title: '03'} 
] 
+0

Avez-vous besoin de remplacer périodiquement des images? Si alors vous pouvez utiliser 'ajax' pour demander des images à partir du serveur et mettre à jour les images – DON

+0

Il existe une solution plus simple? – user1993243

+0

Si vous avez besoin de changer l'image périodiquement, alors vous devez implémenter 'ajax' comme celui qui est une solution plus simple. – DON

Répondre

0

Si vous appelez déjà votre ensemble d'images via ajax il est revenu par exemple

{href:'images/01.jpg', title: '01'}, 
{href:'images/02.jpg', title: '02'}, 
{href:'images/03.jpg', title: '03'} 

... et en supposant que vous avez une série de vignettes, chacun correspondant à chaque image dans la appel ajax comme

<div class="thumbs"> 
    <img src="images/01_thumb.jpg" alt="" /> 
    <img src="images/02_thumb.jpg" alt="" /> 
    <img src="images/03_thumb.jpg" alt="" /> 
</div> 

... avis que j'enveloppai les vignettes dans un div avec class="thumbs" ... alors vous devez attraper ce que le pouce a été cliqué (le index) et ouvrez le fancybox en commençant par l'image correspondante afin que vous puissiez faire

$('.thumbs img').click(function() { 
    var startWith = $(".thumbs img").index(this) 
    $.fancybox(myAjaxCall, { 
     type: "image", 
     index: startWith 
    }); // fancybox 
}); // click 

... avis que je suis ce que le pouce a été cliqué en utilisant la méthode index() dans

var startWith = $(".thumbs img").index(this); 

... et utilisé l'option API index dire fancybox avec quelle image pour lancer la galerie.

Voir JSFIDDLE