It’s time for some more technical web design stuff: When you use Colorbox for overlaying content in an iframe over the main website, you might want to link to another page in this iframe. If you do this, the new page will be shown in the same iframe with the colorbox design around it. Now if this new page doesn’t fit in the iframe, this will look quite messy and won’t be usable. So you want to open the new page in the parent window, but how to do this? The solution is quite simple, no JavaScript needed:

<a href="NEW SITE" target="_top">open in parent window</a>

By defining the target as _top, the iframe will be left and the site will be opend in the parent window. However, as colorbox usually opens and closes with an animation, you might want to animate the closing of colorbox. This is done by a simple JavaScript command:

<a onclick="parent.$.fn.colorbox.close();" href="NEW SITE" target="_top">
open in parent window with animation</a>