> hi,
> I am creating a plugin for my gallery. I am loading image on click of
> a thumnail. thumnail's rel attribute contains the url of the larger
> image.
> In my pluging i have a method to load the clicked image.
>
> LoadSelectedImage = function(){
> var src = $('gallery li.on a').attr('rel');
> var img = new Image();
> $('#testing').css({opacity: .5});
> $(img).load(function () {
> $(this).css({display: 'none'});
> $('#loader').removeClass('loading');
> $('#testing').empty();
> $('#testing').css({opacity: 1});
> $('#testing').append(this);
> $(this).fadeIn(400);
> }).error(function () {
> }).attr('src', src).attr('id','gallery_img_container');
> }
>
> but when this method runs on click of the thumbnail, the whole page
> refreshes and the execution again start from
> $('#gallery1').Gallery(); //start the Gallery plugin
You need to 'return false' from your click handler to prevent the
default browser behavior.