Results 1 to 3 of 3

Thread: PHP Album and FancyBox

  1. #1
    Join Date
    Mar 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile PHP Album and FancyBox

    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:
    Code:
    <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>
    Last edited by jscheuer1; 03-05-2011 at 03:20 PM. Reason: format code

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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?
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Mar 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •