Различные анимации для вкладок Jquery UI

Question

Я использую виджет вкладок jquery ui. Я не использовал тему jquery, так как предпочитаю делать свои собственные CSS и прочее. У меня это работает, но мне бы хотелось иметь другой анимационный эффект для содержимого вкладки при нажатии на другую вкладку. Мне бы хотелось, чтобы содержимое новой вкладки скользило слева.

На данный момент у меня есть:

$("#tabs").tabs({ fx: {slide: 'slow' } }); });

Я знаю, что приведенный выше код просто скользит, а не скользит влево, но он даже не делает слайд! Я загрузил слайд-эффекты как часть моей пользовательской загрузки пользовательского интерфейса. Я не знаю, почему это не работает! Это какой-то CSS, которого мне не хватает ?! Я не знаю !!!

Answer 1

Не уверен, какую версию вы используете, но с 1.7.1 вот как это сделать:

$("#tabs").tabs({ 
    fx: { height: 'toggle', duration: 'slow' }
});

Answer 2

я знаю, что этот вопрос старше года, но вы можете попробовать этот:

$('#tabs').tabs(
{
   fx: { width: 'toggle', duration: '500' }
});

если вы используете 'width', jQuery создаст эффект, используя свойство width, следовательно, горизонтальную анимацию. Вы также можете использовать высоту и ширину вместе для диагонального эффекта.

также попробуйте «скрыть» и «показать» ключевые слова вместо «переключить», они тоже крутые:)

Answer 3

Просто чтобы обновить ответ на этот вопрос, используя версию 1.10 jquery ui, я использовал опцию 'show', чтобы применить эффект перехода на вкладках. Вот пример в документации по jquery ui здесь:

http://api.jqueryui.com/tabs/#option-show

$( ".selector" ).tabs({ show: { effect: "blind", duration: 800 } }); 

Answer 4

Попробуйте это: http://www.eduteka.org/ajax/tabs3/ для дополнительных опций