problem with lightbox

I am having problem with making my thumbnails as lightbox.

Link: http://www.ceanagupta.com/

The images are loaded off Flickr. After load, I want to implement the lightbox, but I am getting JavaScript error:

jQuery(".pi开发者_运维知识库casaGalleryItem").colorbox is not a function

Maybe this is something basic, and I am missing something.

Have a look at the ColorBox FAQ. If I look at the requests I see jquery.min.js twice.

The nasty solution is to replace:

    setTimeout(function(){
        jQuery(".picasaGalleryItem").colorbox();
    },2000);

with

    $(document).ready(function(){
        var _colorbox = $.colorbox;     

        setTimeout(function(){
            _colorbox.apply($('.picasaGalleryItem'));   
        }, 2000);
    });

But seriously... don't unclude jquery twice

For starters, you should wrap your jQuery code in $(document).ready like so (the DOM is not guaranteed ready at the time of execution):

$(function() { //CODE HERE });

Second, you will need to make sure that the images and containing <div> are loaded before you actually execute colorbox on those DIVs. Since you are loading the image gallery asynchronously, you will need to implement a callback function that executes after the images are loaded, with the colorbox function inside. As far as I can tell, you will need to implement this inside of your picasa.js file.