Make Your Own Page

On the left there are a number of choices:

You can select any of them, and when you want to see the page click on the Try It button.

The Background Color is the color this window will be if there is no Wallpaper specified.

Wallpaper is a picture file which is overlayed on the window. The content of the page sits on top of this wallpaper.

The Picture on the Top is a choice of graphics files (both static and animated). If a frame is specified, the picture is surrounded with a 3-D looking frame (created with the TABLES tag).

Title Text is large text placed under the top picture. You can also select a color for this text.

Next is Body Text. This is the descriptive text underneath the title. The body text color can also be specified and is independent from the title text color.

For you programmers note that HTML tags work in the text boxes.

Lastly, you can place a button on the bottom of the page. This button will take you back to the page you came from, and is quite convenient.

All of this is accomplished using JavaScript. In the code for the left frame are the HTML tags to create all the elements of the page. Depending on the options chosen, various of these elements are displayed.

This requires that the JavaScript be able to read the choices made. All the choices are contained in a FORM. Each element of the form is named so that the JavaScript can refer to them.

When multiple choices for an element are possible, each of them can be reffered to in the selected.index for the form element. The file names or colors are also specified in arrays such that the choice in the form has the same index as the file or color needed to create the element. This file name is determined by looping through the possibilities to find a match. The file name is symbolically (via the file name array) placed in the HTML used to create the page.

When the Try It button is clicked, the right frame is cleared (using the open function) and the HTML code is written to the frame using the JavaScript writeln function after the various choices are determined and incorporated. The page is finished using the close function which allows scrolling of the page, if necessary.

The code for the left frame is extensively annotated. Please help yourself, but if you use it, we would like you to give WebSorcerer credit somehow and let us know where your site is so that we can appreciate your work.