jQuery Slideshow with jqxTabs

This post shows how to use and configure the jqxTabs widget so you can create a simple slideshow that automatically switches between the tabs. The $(‘#jqxTabs’).jqxTabs(‘next’) function selects the next tab until the last tab. If the last tab is selected, we call the $(‘#jqxTabs’).jqxTabs(‘first’) function which selects the first tab. The function below switches between the tabs every 3 seconds.
(function slideShow() {
    setTimeout(function () {
        if ($('#jqxTabs').jqxTabs('selectedItem') < 5) {
            $('#jqxTabs').jqxTabs('next');
        } else {
            $('#jqxTabs').jqxTabs('first');
        }
        slideShow();
    }, 3000)
} ());
Online Demo: jQuery Tabs Slideshow Download Demo: slideshow.zip

About admin


This entry was posted in jQuery UI Plugins, jQuery UI Widgets, jQWidgets, jqxTabs and tagged , , , , , , , , , , , . Bookmark the permalink.



Leave a Reply