Обычный способ назначить функциональность цветового блока по ссылке выглядит следующим образом:
$("a.colorbox").colorbox({ transition: "elastic" });Недавно добавленные элементы не связаны таким образом.
Как добавить colorbox к динамически созданным элементам
<a class="colorbox"></a>Метод описанный здесь, предназначен для привязки к событию click для интересующих вас элементов (таких как .colorbox) и вызовите библиотечную функцию colorbox в обработчике:
$('.colorbox').live('click', function() {
$.colorbox({href:$(this).attr('href'), open:true});
return false;
});
Вы также можете попробовать следующее:
$('.colorbox').live('click',function(e){
e.preventDefault();
$(this).colorbox({open:true});
});
Я думаю, что это немного чище, чем с помощью команды fn.
Поскольку live обесценивается, вы должны использовать на
$('body').on('click', '.colorbox', function() {
$('.colorbox').colorbox({rel: $(this).attr('rel')});
});
Этот код также позволяет группировать.
Этот пост старый, но это может помочь другим: Решение simonthetwit в порядке, но вам нужно дважды щелкнуть ссылку триггера. Colorbox можно вызвать напрямую, поэтому это должно работать:
$( '.colorbox' ).live('click',function(e){
e.preventDefault();
$.colorbox({open:true});
//inline example
//$.colorbox({inline:true, width:"50%", href:"#inline_content"});
});
Ура!
Вот решение, которое я нашел, чтобы избежать необходимости дважды щелкнуть ссылку, чтобы запустить событие:
$(document.body).delegate('.<my-class>', 'click', function(e) {
e.preventDefault();
$('.<my-class>').colorbox({<my-code>})
});
У меня была та же проблема, что и @sunburst с необходимостью дважды щелкнуть ссылку триггера. Используется тот же код, но .delegate() вместо .live(). Решила все и очистила мой jQuery!
Хорошее объяснение здесь: http://www.alfajango.com/blog/the-difference-between-jquerys-bind-live-and-delegate/