PDA

View Full Version : PHP Album and FancyBox



kimerlin
03-04-2011, 06:45 PM
Hi,
Is there a way to have the fancybox show images from another folder without the names having to match the thumbnails. In otherwords can you help me modify this code so the fancybox shows all images in the path location that have similar names to the thumbnail

Ie. Thumbnail name= before1.jpg
FancyBox pictures = before1a.jpg, before1b.jpg, before1c.jpg

Thumbnail name= before2.jpg
FancyBox pictures = before2a.jpg, before2b.jpg, before2c.jpg

-----------------------------------------------------------------------------------
Using the code you posted:

<script type="text/javascript">
phpimagealbum.prototype.createHiddenLinks = function(cfg){
cfg = cfg || {}; cfg.groupName = cfg.groupName || new Date().getTime();
var d = document.createElement('div'), tmpLink = document.createElement('a'), lbLink,
i = 0, av = this.albumvar, base = cfg.path || av.baseurl, avi = av.images, avil = avi.length;
d.style.display = 'none'; tmpLink.rel = 'fancybox_' + cfg.groupName;
for(i; i < avil; ++i){
lbLink = tmpLink.cloneNode(false);
lbLink.href = base + avi[i][1];
lbLink.title = avi[i][2];
lbLink.tabindex = avi[i][0];
d.appendChild(lbLink);
}
document.body.insertBefore(d, document.body.firstChild);
lbLink = d.getElementsByTagName('a');
$(lbLink).fancybox();
this.onphotoclick = function(ref, idx){
var i = lbLink.length -1;
for (i; i > -1; --i){
if(lbLink[i].tabindex == idx){
$(lbLink[i]).click();
break;
}
}
};
};

new phpimagealbum({
albumvar: ba_gallery, //ID of photo album to display (based on getpics.php?id=xxx)
dimensions: [1,3],
sortby: ["file", "asc"] //["file" or "date", "asc" or "desc"]
}).createHiddenLinks({path: '<?= $this->site->asset_path('images/ba_galleryslides/') ?>'}); //takes optional object as argument, ex: {groupName: 'demopics', path: 'alternate_path_to_larger_images/'}
</script>

jscheuer1
03-05-2011, 03:33 PM
Can FancyBox do that normally? If so, what's the syntax? If I had that, I could probably work it in somehow. But if FancyBox doesn't have a way to show multiple images from a single click, then there's no reason why my code would make it do so.

And, for clarity's sake, would these multiple images be in a single FancyBox, or as the next/previous choices within the generated FancyBox?

Like:


Do I click on a thumbnail and see three images (before1a.jpg, before1b.jpg, before1c.jpg) in a FancyBox?


Or:


Do I click on a thumbnail and see one image in a FancyBox - say before1a.jpg, and then if I click the next button in the FancyBox I see before1b.jpg, then before1c.jpg?


Or did you have something else in mind? Will there always be three and only three images?

kimerlin
03-06-2011, 03:50 PM
Morning John,

Thanks for your prompt response! Im not sure what syntax... but from what I can tell Fancybox's image gallery would give me the results im looking for: where you click on one picture and are shown a group of pictures. I am playing around now to see if I can figure out a way to identify groups and maybe link them that way.

I would like it where you can click on the thumbnail and see one image in a FancyBox (before1a.jpg) and then when the next btn is clicked you will see before1b.jpg, then before1c.jpg and so on.

The number of pics will vary by thumbnail. I'm showing before and after pictures of home remodeling projects.