| |
Add Cool Stuff: Applet Library
Gliding Images Detail |
| |
This applet gives you a unique presentation of images. The gliding images applet is a banner applet that lets you
define the which direction the images will enter from and exit by. |
| |
| Step 1:
Copy Code |
| |
The text box below contains all of the applet code you need to put the applet
on your page but, you will have to make some modifications as described in the following steps. |
| |
| |
This applet requires images.
Read all the instructions carefully, and be certain to:
(1) Choose your own images (.gif or .jpg files) to use in the applet.
(2) Replace the image names in the code (Name-Of-Your-Image, Name-Of-Your-First-Gliding-Image, etc) with the actual names of your images.
(3) Replace the link names in the code (URL-Of-Link-To-Image1, etc) with the actual links to your images.
If you miss one of these steps, the applet will appear as a gray or black area on your page.
|
| Note :
Although this applet may be customized, DO NOT alter the first line of the HTML code.
The applet will not work if the first line of the HTML code, which begins "
|
| |
| Step 2:
Customizing the applet - Width and Height (REQUIRED) |
| |
Change the values for WIDTH and HEIGHT to the actual values for your image
using the pixel measurements of the image. |
| |
| Step 3:
Customizing the applet - Images and Background (REQUIRED) |
| |
Use the IMAGE parameter to specify the images of the applet by numbering
each image in the order it is to appear. Your first image is IMAGE 1, the second image is IMAGE 2, and so on, until
you have entered all of the images of the applet.
Change the value for the BACKGROUND IMAGE parameter to reflect the name of the image that you want to use as the
background of the applet. This image will show while the applet is loading. Not required if a background color
is chosen.
Make certain the images are in the same directory as the HTML page that you are going to put the applet on, and
that the case of the file name matches. You may use either .jpg or .gif images.
The BGCOLOR parameter allows you to choose the background color of the applet, specified in hexadecimal, as when
creating HTML pages. Defaults to white or a selected BACKGROUND IMAGE. |
| |
| Step 4:
Customizing the applet- Links and Comments (Recommended) |
| |
These parameters are optional features of the applet. Each image displayed
can have a link and/or comment associated with it.
The LINK parameter allows you to specify the address of the page that will be loaded when the image is selected.
Simply use the LINK parameter along with the number of the corresponding image. The link for IMAGE 1 is LINK 1,
IMAGE 2 is LINK 2, and so on. It is not necessary to give every image a link if you use this parameter.
Similarly, each image can have an associated comment that will appear in the status bar when the mouse is over
that image. The COMMENT parameter uses the same method as the link: add the number of the related image to the
parameter. For example, the comment for IMAGE 2 is COMMENT 2, IMAGE 3 is COMMENT 3, and so on. Defaults to the
URL of the link associated with that image, or it is blank if there's no link. |
| |
| Step 5:
Customizing the applet- Animation (Recommended) |
| |
The following parameters allow you to control the speeds and delays of the
animation of the applet.
The HORIZONTAL JUMP parameter defines how many pixels the applet glides the images up or down with each animation.
Defaults to 5.
The VERTICAL JUMP parameter defines the gliding of the images to the left or right, in pixels, with each animation.
Defaults to double the HORIZONTAL JUMP value.
The ANIMATION DELAY parameter determines the speed or time, in milliseconds, between drawing each animation. Defaults
to 100 msec.
The PAUSE parameter determines the time, in milliseconds, that the image will be fully displayed before gliding
in the next image. Defaults to 5000 msec. |
| |
| Step 6:
Customizing the applet- Transitions (Recommended) |
| |
This step is important in giving the unique look to your applet. You have
control over which direction each image enters and leaves the applet.
The TRANSITION IN parameter determines from which direction the image will enter from. Use this parameter along
with the number of the associated image, as with the LINK and COMMENT parameters. For example, to define the direction
that the first image will enter, use TRANSITION IN 1, for the second image use TRANSITION IN 2, and so on.
Images may enter the applet from the LEFT, RIGHT, UP, DOWN, or REPLACE the preceding image without gliding in.
Enter the appropriate value in the TRANSITION IN parameter to get the desired effect.
The TRANSITION OUT parameter defines the direction that the image will exit the applet. Again, use the parameter
name along with the number of the associated image. For example, to determine the direction that the first image
leaves, use TRANSITION OUT 1, for the second image use TRANSITION OUT 2, and so on.
Images can exit the applet from the LEFT, RIGHT, UP, DOWN, or STAY until the next image either glides in or replaces
it. Enter the appropriate value in the TRANSITION OUT parameter for the desired effect. |
| |
| Step 7:
Go to File Manager |
| |
Click on the File Manager button below.
Follow the File Manager instructions and save the HTML.
|
|
Back to Applet Library |
|
|
