jqueryjquery-toolsjquery-scrollableautoscrollscrollable

Jquery Tools - Scrollable, circular - problem with a logo parade, logos don't re-appear until the last logo is shown


I am having an issue with jquery tools / scrollable plugin.

Using the circular:true option, on this page: http://oda.sanscode.com/

The logo parade shown will only clone the logos when the last logo is reached. This leaves a visible gap between the time the last logo is shown and the first logo is replicated.

I need to change the logic behind circular so that there is no visible gap.

Here's the code from the jquery tools plugin:

// circular loop
    if (conf.circular) {

                    //take the last item, prepend it to the itemWrap
        var cloned1 = self.getItems().slice(-1).clone().prependTo(itemWrap),
             cloned2 = self.getItems().eq(1).clone().appendTo(itemWrap); //take the second item, place it after the itemWrap


        cloned1.add(cloned2).addClass(conf.clonedClass);

        self.onBeforeSeek(function(e, i, time) {


            if (e.isDefaultPrevented()) { return; }

            /*
                1. animate to the clone without event triggering
                2. seek to correct position with 0 speed
            */
            if (i == -1) {
                self.seekTo(cloned1, time, function()  {
                    self.end(0);
                });
                return e.preventDefault();

            } else if (i == self.getSize()) {
                self.seekTo(cloned2, time, function()  {
                    self.begin(0);
                });
            }

        });

        // seek over the cloned item
        self.seekTo(0, 0);
    }

Can someone please assist me?

Thanks


Solution

  • Someone on the jquery tools forum posted a solution here: http://jquerytools.org/forum/tools/35/46918