js/components/showcase.js
function(index) {
        if (this.animating) {
            return;
        }

        index = $.bound(index, this.data.length);

        // Exit since transitions don't occur
        if (index === this.index) {
            return;
        }

        var self = this,
            element = this.element,
            caption = this.caption,
            list = this.items,
            listItems = list.children('li'),
            listItem = listItems.eq(index),
            items = this.data,
            item = items[index],
            deferred = $.Deferred();

        this.fireEvent('jumping', [this.index]);

        // Update tabs
        this.tabs.find('a')
            .removeClass('is-active')
            .eq(index)
                .addClass('is-active');

        // Reset previous styles
        listItems.conceal(true);
        caption.conceal(true);
        element
            .addClass('is-loading')
            .aria('busy', true)
            .reveal();

        // Setup deferred callbacks
        this.animating = true;

        deferred.always(function(width, height) {
            list.transitionend(function() {
                caption.html(item.title).reveal(true);
                listItem.reveal(true);
                self.position();
                self.animating = false;
            });

            self._resize(width, height);

            element
                .removeClass('is-loading')
                .aria('busy', false);

            listItem
                .data('width', width)
                .data('height', height);
        });

        deferred.fail(function() {
            element.addClass('has-failed');
            listItem.html(Toolkit.messages.error);
        });

        // Image already exists
        if (listItem.data('width')) {
            deferred.resolve(listItem.data('width'), listItem.data('height'));

        // Create image and animate
        } else {
            var img = new Image();
                img.src = item.image;
                img.onerror = function() {
                    deferred.reject(150, 150);
                };
                img.onload = function() {
                    deferred.resolve(this.width, this.height);
                    listItem.append(img);
                };
        }

        // Hide loader
        if (this.blackout) {
            this.blackout.hideLoader();
        }

        // Save state
        this.index = index;

        this.fireEvent('jumped', [index]);
    }
function(index) {
        if (this.animating) {
            return;
        }

        index = $.bound(index, this.data.length);

        // Exit since transitions don't occur
        if (index === this.index) {
            return;
        }

        var self = this,
            element = this.element,
            caption = this.caption,
            list = this.items,
            listItems = list.children('li'),
            listItem = listItems.eq(index),
            items = this.data,
            item = items[index],
            deferred = $.Deferred();

        this.fireEvent('jumping', [this.index]);

        // Update tabs
        this.tabs.find('a')
            .removeClass('is-active')
            .eq(index)
                .addClass('is-active');

        // Reset previous styles
        listItems.conceal(true);
        caption.conceal(true);
        element
            .addClass('is-loading')
            .aria('busy', true)
            .reveal();

        // Setup deferred callbacks
        this.animating = true;

        deferred.always(function(width, height) {
            list.transitionend(function() {
                caption.html(item.title).reveal(true);
                listItem.reveal(true);
                self.position();
                self.animating = false;
            });

            self._resize(width, height);

            element
                .removeClass('is-loading')
                .aria('busy', false);

            listItem
                .data('width', width)
                .data('height', height);
        });

        deferred.fail(function() {
            element.addClass('has-failed');
            listItem.html(Toolkit.messages.error);
        });

        // Image already exists
        if (listItem.data('width')) {
            deferred.resolve(listItem.data('width'), listItem.data('height'));

        // Create image and animate
        } else {
            var img = new Image();
                img.src = item.image;
                img.onerror = function() {
                    deferred.reject(150, 150);
                };
                img.onload = function() {
                    deferred.resolve(this.width, this.height);
                    listItem.append(img);
                };
        }

        // Hide loader
        if (this.blackout) {
            this.blackout.hideLoader();
        }

        // Save state
        this.index = index;

        this.fireEvent('jumped', [index]);
    }
function ( index ) { if ( this . animating ) { return ; } index = $ . bound ( index , this . data . length ) ; // Exit since transitions don't occur if ( index === this . index ) { return ; } var self = this , element = this . element , caption = this . caption , list = this . items , listItems = list . children ( 'li' ) , listItem = listItems . eq ( index ) , items = this . data , item = items [ index ] , deferred = $ . Deferred ( ) ; this . fireEvent ( 'jumping' , [ this . index ] ) ; // Update tabs this . tabs . find ( 'a' ) . removeClass ( 'is-active' ) . eq ( index ) . addClass ( 'is-active' ) ; // Reset previous styles listItems . conceal ( true ) ; caption . conceal ( true ) ; element . addClass ( 'is-loading' ) . aria ( 'busy' , true ) . reveal ( ) ; // Setup deferred callbacks this . animating = true ; deferred . always ( function ( width , height ) { list . transitionend ( function ( ) { caption . html ( item . title ) . reveal ( true ) ; listItem . reveal ( true ) ; self . position ( ) ; self . animating = false ; } ) ; self . _resize ( width , height ) ; element . removeClass ( 'is-loading' ) . aria ( 'busy' , false ) ; listItem . data ( 'width' , width ) . data ( 'height' , height ) ; } ) ; deferred . fail ( function ( ) { element . addClass ( 'has-failed' ) ; listItem . html ( Toolkit . messages . error ) ; } ) ; // Image already exists if ( listItem . data ( 'width' ) ) { deferred . resolve ( listItem . data ( 'width' ) , listItem . data ( 'height' ) ) ; // Create image and animate } else { var img = new Image ( ) ; img . src = item . image ; img . onerror = function ( ) { deferred . reject ( 150 , 150 ) ; } ; img . onload = function ( ) { deferred . resolve ( this . width , this . height ) ; listItem . append ( img ) ; } ; } // Hide loader if ( this . blackout ) { this . blackout . hideLoader ( ) ; } // Save state this . index = index ; this . fireEvent ( 'jumped' , [ index ] ) ; }
Jump to a specific item indicated by the index number.
If the index is too large, jump to the beginning.
If the index is too small, jump to the end.

@param {Number} index
Jump to a specific item indicated by the index number . If the index is too large jump to the beginning . If the index is too small jump to the end .