Section Use

Kool Swap can be used sitewide and/or with a selector.

Kool Swap Advantages
Events
Methods

Click a tab to switch content!

Usage

Unlike the sitewide initialisation the selector has to be added in to the initialisation code:

                        $('#tabContent').koolSwap({
   swapTriggerBox : '.tabs',
   bouncingBoxes : '.description, footer',
   bouncingBoxHandling : 'slide',
   direction: 'left-to-right',
   moveSwapBoxClasses : true,
   positionType : 'absolute',
   outEasing : '.easeInOutCirc',
   inEasing : 'easeOutBack',
});

Define the contents with the href to the target page and a selector with the data-ks-load-selector attribute to load the contents from:

                        <a href="/demo/options.html" data-ks-load-selector="#events">Events</a>

Remember to reinitiate with the ksSwapCallback event.