2007 WebStudioHelp.net & SunsetFX.com All Rights Reserved Worldwide
Loren's Layered Thumbnail / Pop-Ups Tutorial / Simple Version * All credit for developing this in-depth tutorial goes to Loren - Great Job! *
Simple - Just an Image
Simple: By following the instructions below, you will create a very basic Pop-Up of just an image. No Border, Background or Text.
This is the code for the first example that will be demonstrated. Depending on your requirements, this code may change from one example to the next. I will be demonstrating some examples of the changes that will be required to do certain things.
The top 4 lines in the code shown in red have been added so that the code functions with the centering code in Web Studio.
The following Code goes into an HTML object:
Right click on this HTML Object > Attach Files
Navigate to the .js files you saved (from the Basics page) and add them to the list.
Adding a Link!
Right click on the object that you have placed on your page and want to link from.
Now click on the radio button for After the Object and enter the following:
Right Click on the HTML Object that you added to the page > Attach Files > Navigate to the image that you want to pop-up when you click on the link, and add it to the list. This will be where you add all of your Pop-Up images!
What I have set up in my example is a pop-up image 500 x 374 centered horizontally and vertically. Click on the following image for a demonstration.
All Pop-up images can be closed simply by clicking outside the image.
All Pop-up images can be moved simply by clicking on the image and dragging.
** Note **
Be sure to follow the steps outlined on the Basics Page to prepare for the following.