JQuery UI - tabs

На сайте используется виджет tabs из jquery ui. Сейчас понадобилось при переключение табов вызывать свою функцию. Тыкал по мануалу, но, что-то не выходит, может кто подскажет..Вот такой код был:

$(".banner").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 6000, true);

пытаюсь отловить событие show:

$(".banner").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 6000, true).tabs({show: function(event, ui) { alert('вкладка переключилась');   }});

Но, ни при клике по ярлыку таба, ни при автопереключение алерт не выскакивает. Подскажите, где ошибся?

Для добавления опции используется след конструкция - .tabs( "option" , optionName , ). Пропущен первый параметр - "option". А вообще почему все параметры сразу не передать массивом при создании виджета, зачем их по одному добавлять?

Как-то интересно у вас алерт вписан... Покажите страницу документации. Я то знаю конечно где ее искать, но правильнее указать ее тут вам.

Может быть просто повесить $('.banner'.bind('click',functuion(){alert('кликнули';}); ?

Цитата:

Может быть просто повесить $('.banner'.bind('click',functuion(){alert('кликнули';}); ?

У меня табы не только по клику переключаются, но и автоматически и нужно запускать функцию и при автоматическом переключение.

Цитата:

А вообще почему все параметры сразу не передать массивом при создании виджета, зачем их по одному добавлять?

Не придумал, как. Пишу тупо в строчку все - виджет не работает..

bel0v, надо смотреть в документацию, есть ли там события на этот счет. А нет так можно дописать.

Так в примере ж показано

$('#example').tabs({

    load: function(event, ui) {

        $('a', ui.panel).click(function() {

            $(ui.panel).load(this.href);

            return false;

        });

    },

   show: function(event, ui) {

        alert("Click");

    },

   //тут другие параметры

});

Документацию просто внимательно почитать надо. А вешать click на контейнер из которого табы создаются не получится, событие будет срабатывать при клике на контейнере, а не на вкладках. Тогда уж надо задавать фильтр по вкладкам и вешать на них, но зачем это, если виджетом предусмотрена вполне достаточная система ивентов.

Цитата ("segoddnja"):

Так в примере ж показано

Че-то туплю совсем видимо. Но, даже такой код:

$(".banner").tabs(

	{

		fx:{opacity: "toggle"},

		show: function(event, ui) {

			alert("Click");

		},

	});

Не ловит переключение табов вручную..

Кстати может это глюк документации, но попробуй индексы массива в кавычки взять, то есть 'fx' и 'show'

Неа, кавычки тоже не спасают и событие сменил с show на select тоже ничего, т.е. даже такой код не ловит переключение табов:

	$(".banner").tabs(

	{

		select: function(event, ui) {

			alert("Click");

		},

	});

Этот код выполняется когда? Один раз, при создании виджета? Или когда виджет уже создан?

Виджет запускается при создание виджета. Т.е. примерно так:

$(document).ready(function () 

{



$(".banner").tabs(

   {

      select: function(event, ui) {

         alert("Click");

      },

   });


});

Сами табы работают, но клики по ярлыкам не ловятся. Нужно именно запускать свою функцию при переключение табов..

Ну тогда даже не знаю в чём дело. firebug ошибок js никаких не показывает?

В чем вся фигня, что никаких ошибок в фаербаге нет %) вчера 3 часа мучался и седня вот...
Может кто подскажет другой плагин для Jquery - нужно 3 кнопки и 3 слайда переключать + что бы автоматом переключались и при переключение можно было колбэк функцию вызывать свою. Желательно что бы не менялась структура html типа:

<div class="banner">


	<ul class="ui-tabs-nav">

		<li class="ui-tabs-nav-item" id="nav-fragment-1">

			<a href="#fragment-1">Вкладка 1</span></a>

		</li>

		<li class="ui-tabs-nav-item" id="nav-fragment-2">

			<a href="#fragment-2">Вкладка 2</a>

		</li>

		<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-3">

			<a href="#fragment-3">Вкладка 3</a>

		</li>

	</ul>

	<div style="" id="fragment-1" class="banner1 ui-tabs-panel">

		Содержимое Вкладки 1

	</div>

	<div style="" id="fragment-2" class="banner1 ui-tabs-panel">

		Содержимое Вкладки 2

	</div>

	<div style="" id="fragment-3" class="banner1 ui-tabs-panel">

		Содержимое Вкладки 3

	</div>

</div>