AAAlake applet overlay

This procedure requires a little more preparation

than the others we have talked about. I use PSP6 and

PSP7 to prepare my images.

For this, you will need an image with water in it like the one i used in the example.

Please Note ***

If you need to make a change your image,

after you have uploaded and previewed it, be sure to

delete the one you uploaded to your webshell and

be sure to change the name of the new one to a

different name. Your temporary internet files will contain the first one that you have done, and even though you may make a change to the image, the first one will show up. Unless you want to It is

not go through all the steps involved to empty that out, you will want to rename the file.

Here is the origional image. You can right click and save

to try working with this image along with me.

Before cutting anything, be sure that your

PSP settings for your tools are :

Using your selection tool, trace from one side of your image

to the other side along the waterline. You will not get a straight edge in most cases, especially with streams or waterfalls. You want to find the topmost part of the water and cut along that line. The image remaining should not have water in it.

Copy and paste the selected area as a new image.

Save it as the bottom image. To make it less confusing

later, I write the height and width down and name the

image something like "springbreezebottom.jpg".

This will be the bottom image.

The height is 54px and the width is 400px.

You will need the size for the applet code tag.

Now, we will go back to the origional image, click on selections/invert and now the top will be selected.

Copy and save this part as "springbreezetop.jpg".

The height and width will be needed for this part too.

The top part of the image width=400px and height=147px

Next you will need to make a transparency the same width as your top and bottom images and 2 times the height of the bottom image. So, you will need a transparency that is 400px in width and 108px in height. You will need to copy the bottom image and paste it at the very top, be careful to use your number guides in the bottom left to line it up exactly.

Once you have this done, you will need to use your lasso tool to cut out the water. Export your image as a gif using the existing layer of transparency. Save the image as

"springbreezewater.gif" You will not need to know the dimensions of this image, only the top and bottom.

Now we will go on to the scripting part for the overlay

image and the lake.class applet. There is a small addition

to the code needed which you will find in the new code below. Make the changes to your new applet

tag that are hightlighted in red below.

For Stationery Use:

* * * Note - When making a stationery you can save

the top image in your stationery folder instead of at

your website. The bottom and water images will need

to be uploaded to the applets file. The height and width

that you will use with the water image are the height

and width of the bottom image.

*** You must use a codebase in the applet tag

when making Outlook Express Stationery.

You would not use it on a webpage.

For Webpages Use:

This is by far the most complicated applet I think you will come across. It is much like the ripple scripts that deal with layers to make the water moving effect. But, all in all, it is one of my favorite applets. I hope that you will enjoy it and that you didn't have too much trouble following the tutorial. Click the link to see another lake overlay done by Shari.

She is the reigning queen of the lake applet overlays. If you have any questions, don't hesitate to ask Karen, Shari, NormJean or any of the other group members for assistance. We will be happy to help you.

Hugs,

Karen