Colorbox : binding cbox_complete differently for multiple lightboxes

I’m using “COLORBOX” (http://colorpowered.com/colorbox/).

I have two different colorboxes on the page and they are accessed as follows.

$  ("#link_1").live('click', function() {
  $  .fn.colorbox({width:"1100px", height:"645px", inline:true, href:"#box_1"});
  return false;
});

$  ("#link_2").live('click', function() {
  $  .fn.colorbox({width:"1100px", height:"645px", inline:true, href:"#box_2"});
  return false;
});

For each of the colorboxes, I need to do some “post processing” by binding “cbox_complete” function.

$  ('#link_1').bind('cbox_complete', function() {
  // something for link_1
  console.log('this happens after link_1 colorbox is opened!);
});

$  ('#link_2').bind('cbox_complete', function() {
  // something for link_2
  console.log('this happens after link_2 colorbox is opened!);
});

But above two “bindings” are not firing. If I do following, it works fine.

$  (document).bind('cbox_complete', function() {
  // something for link_1
  console.log('this happens after link_1 AND link_2 colorbox is opened!);
});

How can I create two different “cbox_complete” bindings? I’ve tried

$  ('#link_1').live('cbox_complete', function() {.....

But this didn’t have any luck either.

newest questions tagged jquery – Stack Overflow