Question

I am using Colorbox 1.3.6 with jQuery 1.4.2. Somehow the folowing code did not work for me:

$(document).ready(function() {
    $.colorbox({href: "something.htm", open: true});
});

which won’t show up automatically, but this one works:

$(document).ready(function() {
    $("#some_element").colorbox({href: "something.htm", open: true});
});

I tried attaching to $("head") which also works! And then I checked the generated elements, it seems that colorbox just added class="cboxElement" to head element and other things all in the body.

But I do not sure if this is a good way to do it (auto popup when the page is loaded) and I can’t figure out why $.colorbox did not work!

Please help!

Answer 1

The problem is that the documentation you’re seeing is for a newer version, not 1.3.6 that you’re using. To do what you want with 1.3.6, try this instead this:

$(function() {
  $.fn.colorbox({href: "something.htm", open: true});
});

---

If you look at version 1.3.6, you’ll see this in the source:

cboxPublic = $.fn.colorbox = function (options, callback) {

It’s not until this commit for 1.3.7 that $.colorbox shows up:

cboxPublic = $.fn.colorbox = $.colorbox = function (options, callback) {

So $.colorbox() does work…but only for version 1.3.7+, as of the time of this answer the current version is 1.3.9, so if you want to use $.colorbox() instead of $.fn.colorbox() just upgrade 🙂