I'm having
a bit of trouble loading pages into an already-existing colorbox.
I have
a colorbox opened by clicked
a link that is bound by the following code:
$("
a.ajaxAddPage").colorbox({
onComplete: function(){
$('ul#addPage li
a').click(function() {
$.fn.colorbox({href: $(this).attr('href')});
return false;
});
}
});
The following HTML is loaded into that colorbox via AJAX:
<div class='colorboxWindow'>
<ul id='addPage'>
<li><a href='addCat.php'>Add Category</a></li>
<li><a href='addPage.php' class='current'>Add New Page</a></li>
<li><a href='addPage2.php'>Add Another Page</a></li>
</ul>
<h3>Add New Page...</h3>
</div>
I'm trying to have each of those 3 links
open in the current colorbox when they are clicked. With my onComplete binding above, this works for the first click, but the next click just opens like
a normal page.
If I add another onComplete to the $.fn.colorbox() call in the above code, then the 2nd click will also load in the same colorbox, but the 3rd will not.
Is there
a way to just bind all future clicks to
open in the same colorbox? I don't know much about event binding yet.
If you need clarification, please ask.
