Are there event listeners available for jQuery UI's tabs widget?
I'm wanting to change the background colour on a web page depending on what tab index is currently active. So something like this (pseudo code):
$('.tabs').addEventListener(index, changeBackgroundImage);
function changeBackgroundImage(index) {
switch (index) {
case 1:
$('body').css('background-image', '/images/backgrounds/1.jpg');
break;
case 2:
$('body').css('background-image', '/images/backgrounds/2.jpg');
break;
case 3:
$('body').css('background-image', '/images/backgrounds/3.jpg');
break;
default:
$('body').css('background-image', '/images/backgrounds/default.jpg');
break;
}
};
Thanks in advance.
it seems the old's version's of jquery ui don't support select event anymore.
This code will work with new versions:
$('.selector').tabs({
activate: function(event ,ui){
//console.log(event);
console.log(ui.newTab.index());
}
});