AAAlakeoverlay

The Applet Overlay (the way I do them)
by Shari

I use PSP 7, but other versions will also be fine.

This tutorial is on making the Lake Overlay Applet. It is very similar to a Ripple Script or Ripple Applet in the manner you will prepare your images. For this applet, you will need the lake.class file. You can download the zip file along with the sniplet of code that you will need at our AAA for OE members file section at the Yahoo Group site. Once you download your file, upload your class file to your your website.

I hope that you will enjoy learning this. If you have any problems, please don't hesitate to ask Karen, Shari, NormaJean or any of the other group members for help. We are here to help one another and we enjoy it.

This is an excellent example of the lake overlay applet. This beautiful creation was made by our very own Shari. Step by step instructions on how to Shari makes a lake overlay applet are below for you....

GREAT JOB,

SHARI !

Everyone has their own way of doing things. This is how I make this type of applet.

# 1. Open your image, duplicate, close original. Let us say that our image is 350 W X 300 H

# 2. Now take your selection tool set to rectangle and starting at left corner, make sure you see 0 X 0 to start this, now drag down till you get just above the water level and make sure that it is the same width as the original, which is 350 wide, this is important. So let’s say you have this new selection, 350 wide and having selected just above the water line it is 250. That will mean that the top will be 350 X 250. now edit, copy, paste as new image. Give it a name like rivertop, save as jpg to where you have your applet stuff.

# 4. We will now be working on the duplicate of riverbottom. We are going to make the gif. With your color tool choose a color not in your image, and add a border of 50 to just the bottom of riverbottom. Notice this is equal to the height of this image. Now with your paintbrush color in all the water, adjust the size of your paintbrush as needed. Now export as transparent gif, name riverwater and save to the same folder as your other files. You now have the top, bottom, and water gif to create your applet.

I always have all my files in a special folder on my desktop called applets, that is where the class files, backgrounds etc. everything is stored. I only then need to upload the three files and the class file to my site for my applets to work for my stationery. This method will still work with the iframe code. So, give it a try today, have a question let me know and I’ll try to help out.

Turns out great for me every time, hope it will for you too!

Hugs,

Shari

For Webpages Use :

For Stationery Use :

** Notice that the only difference between the webpage code and stationery code is the use of the codebase="http://website addy goes here/" in the code. This is a very important part of the stationery code. Also, it is a good idea to remember that even if you are going to store all of the images on your website, be sure to use complete website addresses for each of the images because the applet doesn't seem to work well without them.

<APPLET codeBase="http://your website addy/applets/" code=lake.class

width=480 height=178><PARAM NAME="overlay" VALUE="http://your website addy/applets/water image name.gif"><PARAM NAME="speed" VALUE="10">

</APPLET>

Copy the <applet> code above and paste it onto a notepad document. Make the necessary changes to the code and save the document as an .html file Then, upload the .html file along with your image files to your website. I always try to name my documents something similar to my stationery .html file for easy retrieval at a later date in case it is necessary for changes to be made to the file in the future.

Once you have uploaded the file, you will use the name of this applet .html file in the address of the <IFRAME> tag that is pasted into your stationery script where your applet image will appear. I have highlighted in red in the code below the changes that you will need to make to the iframe code also.

Iframe Code:

<IFRAME height=400 marginHeight=0 src="http://www.your website.com/name of applet file.html" frameBorder=0 width=400 marginWidth=0 scrolling=no></IFRAME>

*Don't forget to change the height and width of your image in the <iframe> tag.