Hi,

I want to be able to reach the underlying page when a floatbox(image) is up, to launch another floatbox(image) but I want the first floatbox to close automatically.


With modal the boxes stay up, and I also tried this code:

<script type="text/javascript">
fb.addEvent(document, &#039;mousedown&#039;, function(e) {
    if (!fb.ownerInstance(e.target)) fb.end(true);
});
</script>

But now anywhere I click including the space bar (and this is not good for me) closes the box, and the transitions between images is a bit jumpy.

Is there a way to get this done properly by reaching the underlying page? can I insert some text directly inside my floatbox images/link to auto close the previous box? Thanks.

It's not clear to me what you want to do so I am unable to tell you directly how to do it. But perhaps I can offer a couple of helpful pointers.

If you set modal:false in the options for a floatbox, the underlying page remains accessible and clickable.

Passing true as a parameter to fb.end() means, close all open floatboxes when more than one is open.

I don't think adding a mousedown handler to the document could affect image transition smoothness. Something else is probably going on there. I'd need to see the page to determine what.

There's no problem putting a click handler on an element inside the floatbox content that calls fb.end(). Please see the Multiple Floatboxes section of the API Reference if you have more than one floatbox open and need to end a specific one.

Rather than closing one floatbox at the same time as opening another, consider re-using the exiting floatbox. Do this by setting sameBox:true in the options. Combining sameBox:true with modal:false might get you to where you want to be.

Thank You I will look into that and see if I can find a way. I don't have a page as an example right now, but once I try a few things will upload one. Ty.

That worked like a charm, thank you!