HOW TO: Create a Lightbox Popup (In 5 Steps)

[Former Member]

This tutorial will teach you how to create a Lightbox Popup with a "Click anywhere to close" functionality.  After going through this tutorial, you will know not only how to create this popup but also how to modify it to suit your particular needs.

Step 1: Insert the Popup button

Insert a Push Button component in your dashboard.  This button will trigger the popup. 

• Source: B2. 
• Destination: B1.

Step 2: Build the Spreadsheet formulas

Put the following formulas in the corresponding cells:

• A1 = "Popup Visible?"
• B1 = "No"
• B2 = "=IF(B1="Yes","No","Yes")"

This is what you should end up with:

Step 3: Popup background

Add a Rectangle component, which will become the shaded background of your popup.  Set its properties as follows:

• Fill: Solid, Black. 
• Transparency: 50%. 
• Visibility Status: B1.
• Visibility Key: "Yes". 

Change the rectangle's size until it covers your entire dashboard (or whatever region you wish to obscure)

Step 4: Popup

Add your popup component.  Set its properties as follows:

• Visibility Status: B1.
• Visibility Key: "Yes". 

Step 5: "Close Popup" button

Add another Push Button component to the dashboard.  This button will implement the "Click anywhere to close" functionality.  Set its properties as follows:

• Label: None. 
• Source: B2. 
• Destination: B1.
• Visibility Status: B1.
• Visibility Key: "Yes".
• Transparency: 100%. 

Change the button's size until it has the same size as the black rectangle from step 3.  Also ensure that this push button is 'on top of' both the black rectangle from step 3 and the popup component from step 4.

End Result

The end result should behave as follows:

          1. Click the popup button from Step 1

          2. The shaded black rectangle and popup image should appear, as well as the invisible button on top of them

          3. Clicking anywhere triggers the invisible button, which closes the popup