Popup a Photo in a New Window - December 2011

If you download this tip please consider making a modest donation.

This tip-of-the-month demonstrates how to display a photo in a popup window. A thumbnail is displayed in the main window. When the thumbnail is clicked an enlarged photo appears in a popup window. Click here to run the demo.

The Demo Application

The Asp.Net, VB.Net, VS/2008 project PopupPhoto is documented using screen captures:


Click either photo to display an enlargement in a popup window.


The enlarged photo is displayed in a separate window. Click the photo or the 'Close' button to close the window.

Operative Code

Get Image Size - The popup window size is determined by the width and height of the photo. Class cImageSize, method GetImageSize returns properties: lSize, iWidth and iHeight. Review the source code for details.

Javascript Open.Window - The popup window is opened by adding an 'onclick' attribute to the thumbnail image. Class cOpenWindowJS, method GetScriptSizeable is used to build the script. Review the source code for details.

Download the VB.Net Code

Download the source code by clicking on the zipped file name. Click here to run the demo application.

Download - Source Zipped File Size
VS/2008 VB.Net, ASP.Net Solution PhotoPopup.zip 282K

Previous Tip    Tip Index    Next Tip

Home

Updated 2011/12/28