Блог

Главная - Вопросы по программированию - Динамическое добавление имени класса в Colorbox

Динамическое добавление имени класса в Colorbox

#jquery #function #colorbox

#jquery #функция #colorbox

Вопрос:

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

С помощью следующего кода я хочу добавить имя класса в лайтбокс colorbox после его открытия.

По какой-то причине вторая функция (где выполняется .addclass) не работает (когда я проверяю код в firebug, он даже не вводит эту функцию).

         $(document).ready(function(){
            $(".box1").colorbox(function(){
                $("#colorbox").addClass("box1");
            });
        });

Это что-то, чего мне не хватает, или я пытаюсь сделать это неправильно?

Спасибо, Ян

Ответ №1:

Обновить:

Более новые версии Colorbox поддерживают новый параметр className, который можно использовать для добавления дополнительных имен классов в colorbox.

Оригинальный ответ:

Вам нужно указать обратный вызов onOpen для colorbox следующим образом:

    $(document).ready(function(){
       $(".box1").colorbox({onOpen: function(){
           $("#colorbox").addClass("box1");
       }});
   });

Также есть возможность прослушивать cbox_open событие вместо использования обратного вызова — см. http://jacklmoore.com/colorbox / для получения дополнительной информации.

Комментарии:

1. Отлично, спасибо! Обратный вызов — это то, что мне нужно сейчас, поскольку я хочу вызвать colorbox из 3 разных элементов на странице и добавить другое имя класса для каждого colorbox. Я уверен, что мог бы сделать это более элегантным с прослушиванием событий, но рассмотрю это позже.

Ответ №2:

Попробуйте это, согласно разделу EventHook в ColorBox.

 $(document).bind('cbox_complete', function(){
    $("#colorbox").addClass("box1");
});

Ответ №3:

Это сделает свое дело, это новый атрибут:

 $('.my-box').colorbox({className: 'my-class'});