A jQuery thickbox allows you to create a popup region without actually opening a new browser window or tab. The thickbox region can contain some content already on the page, usually hidden when the page is viewed normally, or the content of another page.
Before starting you must have included the jQuery library in your APEX application. For instructions on how to do this check the guide Integrating jQuery into APEX
<link rel=”stylesheet” href=”#WORKSPACE_IMAGES#thickbox.css” type=”text/css”>
To use the thickbox to display an existing region do the following
Create a region with “No template” and place the following in the region header
<div id=”thickbox_region” style=”display:none;”>
And close the div in the footer
Now create some content in the region to give the thickbox some content. For example I will create two items, P2_TEXT and P2_DATE. These items are purely dummy content.
Next, create a region to hold the buttons that will launch the thickbox region. This region does not require any specific settings.
Finally create the button that will launch this region. First create a button with the default regions, then once the button has been created alter the following settings.
For the optional URL redirect enter
And for the button attributes enter
You will notice from the alt tag that you can alter the width and height settings for the tickbox. For details of other settings visit jquery.com/demo/thickbox/
Now when you run the page and click the button the thickbox region should appear like the following example.
To view the above example click here