Вкладки пользовательского интерфейса jQuery: изменение div с использованием атрибута данных с помощью события bind * broken * - PullRequest
Новая
       6

Вкладки пользовательского интерфейса jQuery: изменение div с использованием атрибута данных с помощью события bind * broken *

0 голосов
/ 06 мая 2011

Должно быть легко, но у меня здесь кое-что сломано, я не могу понять - jsfiddle: http://jsfiddle.net/8muBm/9/

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

Но заставить это работать ускользает от меня прямо сейчас ... 

$('#tabs').bind('tabsshow', function(event, ui) {

var $tabs= $("#tabs").tabs();

var img = $(ui.panel).data("image");
$("#headerwrapper")
.animate({ opacity: 'toggle' }, function() {
$(this).css("background-image", "url(" + img + ")")
.animate({ opacity: 'toggle' });
});
}
});

Ответы [ 2 ]

0 голосов
/ 06 мая 2011 
var $tabs= $("#tabs").tabs();


$('#tabs').bind('tabsshow', function(event, ui) {
    var img = $(ui.panel).data("image");
    $("#headerwrapper").animate({ opacity: 'toggle' }, function() {
        $(this).css("background-image", "url(" + img + ")").animate({ opacity: 'toggle' });
});
});
0 голосов
/ 06 мая 2011

Здесь http://jsfiddle.net/pSDqh/

Изменения:

  • Удалите инициализатор вкладки из события.
  • Несколько сломанных},)

Обновление :

  • Улучшена анимация, теперь она не отключается.
  • Помещенный скрипт в событие загрузки для обеспечения инициализации.

Если вы не хотите использовать tabs (), используйте только ссылки, это здесь: http://jsfiddle.net/Jayea/

...