Convert jQuery Colorbox to act as a user dialog?

Question

Is there a nice and easy way to have a Colorbox act as a dialog window? I understand there are enough events which can be addressed but I'm unable to construct this in a nifty way... Or are there existing ways to replace the close button with ok/cancel or yes/no or other buttons..?

Edit: I need to be able to pass somesort of return function (similar to an event) and execute that based on a button click in the dialog (box). Functionality similar to jQuery UI Dialog "buttons"

Answer 1

DEMO: http://jsbin.com/ibubo4/3

// cerate the two buttons...
$(".example").colorbox({
    close: '<div id="btn_yes" class="btn">yes</div>'+
           '<div class="btn" id="btn_no">no</div>'
 // without overlay.. uncomment this
 /*,onOpen:function(){ 
      $('#cboxOverlay').css('visibility','hidden');
      }*/
});

//observe our new buttons..

    $('#btn_yes,#btn_no').live('click',function(e) {
        var clicked_button = $(e.target).attr('id');
        if (clicked_button == 'btn_yes') {
             alert('yes');
            } else {
             alert('no');
            }
    });

CSS

#cboxClose {
    position: absolute;
    bottom: 0;
    right: 0;
    /*background: url(images/controls.png) -25px 0px no-repeat;
*/
    width: 100px;
    height: 20px;
    /*text-indent: -9999px;
*/
}
/* style for our buttons*/
.btn {
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
    margin: 0 5px;
}
#cboxClose .btn {
    display: inline
}
#cboxClose.hover {
    /*background-position: -25px -25px;
*/
}