Adding classname to Colorbox dynamically

Question

I've seen questions regarding this issue on here already, but I'm having a different issue trying to get it to work.

With the following code I want to add a classname to the colorbox lightbox once it has opened.

For some reason though the second function (where .addclass is executed) does not work (when I inspect the code in firebug it doesn't even enter that function).

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

Is it something I'm missing or am I trying to do this incorrectly?

Thanks Ian

Answer 1

UPDATE:

Newer versions of Colorbox support the new className setting which can be used to add extra class names to colorbox.

---

Original answer:

You need to specify the onOpen callback for colorbox like this:

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

There's also an option to listen for the cbox_open event instead of using a callback - see http://jacklmoore.com/colorbox/ for more information.