Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 1 of 1
  1. #1
    Junior Member Sanjin Alisic's Avatar
    Join Date
    Apr 2011
    Posts
    11
    Member #
    27531
    Hey there,
    So I've been working on embedding Picasa albums on my page, and found a way to get that working pretty well with Javascript. Only thing I can't figure out with it, is how to add a lightbox function into the javascript file.

    This is the code to the JS

    Code:
    /**
    *
    *  Add picasa gallery to your blog or website
    *  http://www.webtoolkit.info/
    *
    **/
    var picasa = {
    
        galleries: 0,
    
        gallery: function (galleryObjectId, galleryObjectName, settings) {
            this.galleryObjectId = galleryObjectId;
            this.galleryObjectName = galleryObjectName;
            this.containerId = settings.containerId;
            this.userName = settings.userName;
            this.albumName = settings.albumName;
            this.imageSize = settings.imageSize;
            this.itemsArray = [];
    
            this.setup = function (data) {
                this.itemsArray = data.feed.entry;
                this.totalItems = this.itemsArray.length;
    
                 for (var x = 0; x < this.totalItems; x++) {
                    jQuery('#' + this.containerId).append('<div onClick="document.location.href=\''+this.itemsArray[x].media$group.media$content[0].url+'\'" class="picasaGalleryItem" style="cursor: pointer; width: ' + this.imageSize + 'px; height: ' + this.imageSize + 'px; background: url(' + this.itemsArray[x].media$group.media$thumbnail[0].url + ') no-repeat center center; "></div>');
                }
            };
    
        },
    
        load: function (settings) {
            var galleryObjectId = picasa.galleries++;
            var galleryObjectName = 'picasa.gallery' + galleryObjectId;
            var galleryObject = eval(galleryObjectName + ' = new picasa.gallery(galleryObjectId, galleryObjectName, settings)');
    
            scriptLoader.load([
                'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js',
                'http://picasaweb.google.com/data/feed/api/user/' + galleryObject.userName + '/album/' + galleryObject.albumName + '?alt=json-in-script&callback=' + galleryObjectName + '.setup&kind=photo&thumbsize=' + galleryObject.imageSize
            ]);
        }
    
    }
    I'm assuming the function would go into this string, just not sure how. And I'm using the colorbox plugin from here, http://colorpowered.com/colorbox/

    Code:
    for (var x = 0; x < this.totalItems; x++) {
                    jQuery('#' + this.containerId).append('<div onClick="document.location.href=\''+this.itemsArray[x].media$group.media$content[0].url+'\'" class="picasaGalleryItem" style="cursor: pointer; width: ' + this.imageSize + 'px; height: ' + this.imageSize + 'px; background: url(' + this.itemsArray[x].media$group.media$thumbnail[0].url + ') no-repeat center center; "></div>');

  2.  


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:46 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com