Popup Window Tutorials
The following articles form a tutorial series introducing you to how to create and manipulate popup windows with Javascript. The tutorials were written for the http://javascript.about.com/ web site (for which Ask Felgall author Stephen Chapman is now the Guide) and the links below will open the articles directly from that site.
- Basic Popup Windows
The first in this tutorial series on popup windows shows you how to create a popup window to display an existing web page
- Javascript Generated Popup Windows
Javascript can do more than create a new window, it can create the content for that window too..
- Popup or Popunder
The new window doesn't have to appear in front, you can control both where and when the window appears.
- Timed Window Close
Where you don't need the new window to stay on the screen indefinitely you can have it remove itself after a selected time period.
- Positioning the Popup Window
The popup windows that we have looked at so far in this tutorial series have poppped up at whatever position on the screen that the browser thought was appropriate. Here we add the code necessary to place the popup window where we want.
- Reusing Popup Windows
When you want to place multiple links on the same page (or different pages) that all need to open a popup window you don't need to open a separate popup for each. Having multiple popup windows will annoy your visitors. Instead you can reuse the same window each time.
- Resizing the Popup Window
When you reuse an existing popup window it may not be the correct size for the new content. You can resize the window to fit.
- Thumbnail Image Links
You can use what you have learned in the earlier tutorials to create popup windows just big enough for the larger image attached to your thumbnail image.
- Captioned Image Popup
The final part of the tutorial series on popup windows shows you how to incorporate still more of the features that have been discussed to provide captions under the images in your popup windows.
