A simple solution would be:

function forwardClick() {
                        var i = $('#images .visible').attr('id');
                        var currentImg = $('#images .foo:eq(' + i + ')');
                        var nextImg = $('#images .foo:eq(' + j + ')');
                        var currentDesc = $('#descriptions .bar:eq(' + i + ')');
                        var nextDesc = $('#descriptions .bar:eq(' + j + ')');

                        currentImg.animate( { marginLeft: left }, 300, function 
() { $
(this).removeClass('visible'); } );
                        nextImg.css('margin-left', 
'240px').addClass('visible').animate
( { marginLeft: "0" }, 300 );

                        currentDesc.animate( { marginLeft: descLeft }, 300, 
function() { $
(this).removeClass('visible'); } );
                        nextDesc.css('margin-left', 
descRight).addClass('visible').animate
( {marginLeft: "0" }, 300 );
                        i += 1; j += 1; k += 1;

                        if (i > length - 1) { i = 0; }
                        if (j > length - 1) { j = 0; }
                        if (k > length - 1) { k = 0; }
                            $('#forward').bind("click", function() {
                                 $('#forward').unbind("click");
                                 forwardClick();
                            };
}
                $('#forward').click( function() {
                                 $('#forward').unbind("click");
                                 forwardClick();
                });

But I'm sure there's a better way to do it...

On Apr 24, 10:39 am, roryreiff <roryre...@gmail.com> wrote:
> Hello there,
>
> I have created a simply navigable image gallery with a bit of json, as
> well as .animate() and altering the margin of elements. Currently, I
> am pulling in the 5 most recent images with a tag of 'spock' from
> flickr. It seems to be working fine, except that when clicking through
> very fast it gets a bit wonky. I am also really curious as to opinions
> on better ways of doing this? Perhaps there is a way that relies upon
> the json instead of simply just injecting it into the dom right off
> the bat?
>
> The basic strategy I employed was to animate the current image off the
> stage, and then make it invisibe, while also animating the next image
> onto the stage after making it visible. I have a feeling it's these
> queued effects/animations that aren't dealing so well with fast
> clicks. Perhaps the best way to solve this is limit when/how the
> arrows can be clicked?
>
> Any help is greatly appreciated. Thanks!
>
> example:http://www.pomona.edu/dev/spock/index.asp
>
> js:http://www.pomona.edu/dev/spock/spock-feed.js

Reply via email to