A challenge for your Christmas stocking

I found this trying to give our users a floatbox with Google Images inside so they could "borrow" an image from Google images.

What I expected was that when you iFrame a site it stays within the iFrame no matter what you do on that site.

aHa...of course as my luck is almost exhausted today...the site I want to iFrame won't behave...Google Images.

Steps to reproduce:

On the floatbox demo page

http://floatboxjs.com/demo.php

down in the HTML Content section, click the link "Nested (Stacked) Floatbox Content"

In the first frame click "Google News (external)"
Click the second link top left "Images".

Type anything in the search box (I used "green") and click "search images".

Click on the first image (I see "Green Procurement" but it doesn't really matter)

Up to this point everything works as expected. the back/forward buttons page through your google pages [staying in this iFrame] and also if you close the floatbox either by close[] in the floatbox title bar or clicking outside the box...this layer goes away and you are back to the previous floatbox layer.

Now for the problem...

Click on anything in the top portion of this google window [See full size image, Back to image results, explore.toshiba.com/green, Remove Frame] and boom...floatbox is gone along with all it's layers.

I was calling google images in a floatbox from a form that was half filled out. There is no way to get back to that half filled out form.

Is there a switch in floatbox js that might fix this?

Merry Christmas

You don't have to go to quite so much trouble to see the problem. You can just load Google news directly from the demo page and get an image search from there.

The page returned from selecting an image search result is a frameset document. The top frame that includes those links you refer to has <base target="_top"> in its head section. This directs each of the links in that frame to open in the top document, which is what they do. There's nothing that can be done to change this behaviour. When clicked, they will always open in the top window (i.e., replace the top document) from within any lightbox or any other frame or iframe. Any link that specifically targets something other than its current window will "escape" from floatbox's clutches.

This is akin to sites which include frame-busting javascript code. For example, load Google News in floatbox and click on any New York Times article. It will replace the top page. NYT's common.js file includes the following javascript:

if (window.self != window.top && !document.referrer.match(/https?:\/\/[^?\/]+\.nytimes\.com\//)) {
	top.location.replace(window.location.pathname); 
}

In summary, all pages that target the top window or that include frame-busting code similar to the above, will always escape any frames they are called from.