|
|
CoolSlides is a very compact Java applet. It has only one critical file, the CoolSlides.class. All of the other files you can change or replace. You do not need to know Java to use it. All you need to do is to set the parameters for the CoolSlides in an HTML file, such as the Example.html included in the download. You can use any JPG or GIF files and enter any text descriptions. You can show up to 1000 slides with descriptions before it loops back.
Operation is simple. There is no need for non-programmers to be intimidated: changing an image, a URL, or a description is simple text editing. CoolSlides does all the rest for you behind the scenes.Since you do not need to be connected to the Internet to run CoolSlides, testing it is also simple and quick. You can even test one slide at a time. The CoolSlides engine will run the slides in an infinite loop, so that your display is always in action as long as the web page is displayed.The animation stops when the cursor is placed over it. This allow your visitors to look at the display in detail or to click to visit the URL for the slide. |
|
If you are new to CoolSlides or just want an easy going, these are some steps that you may like to follow:
| |
| Home | Width/Height | OwnerURL | Partition | FirstSlide/LastSlide | Background | Pause | Jump |
|
Width Height |
To adjust the display size, change
the values of the
Width and the Height parameters. They are located in the <APPLET ...> tag.
For example,
<APPLET code=CoolSlides Width=320 Height=295>
sets up a 320x295 pixel applet
area. Inside this applet area, the CoolSlides logo takes 23 pixels on the top while
the buttons take 22 pixels at the bottom. This leaves a display area for the slides as wide
as the applet area, but 45 pixel shorter than the applet area, i.e. 320x250 pixels.
|
OwnerURL |
This parameter is used as CoolSlides ID.
Do not alter or remove it. If it is changed or removed, you will not be able to set
up your own URLs. |
Partition | You can set up the CoolSlides to display your
images and descriptions horizontally or vertically using the Partition parameter. For
example
<param name=Partition value="150, East">
cuts out a 150 pixel wide
description window on the left of the display area, while
<param name=Partition value="50, South">
cuts out a 50 pixel high description window at the bottom of the
display area. You can set the number to be zero for no description window. The location
has to be South or East (East is the default). The dimension of the image window is the
display area minus the description window.
We suggest that you set the image window exactly the same dimension as your images and
adjust your image dimensions if necessary.
|
FirstSlide LastSlide |
The CoolSlides program plays the slides in a infinite
loop between FirstSlide and LastSlide. For example,
<param name=FirstSlide value=140>
allow only the slides between 140 and 190 to be shown. The values for a slide number
must be three digits,
anyone from 000 to 999. The LastSlide must be greater than the FirstSlide.
|
bgColor |
You can set up different background colors for the
display window using the bgColor parameter. For example,
<param name=bgColor value=#00ff00> tells the CoolSlides to set up a green background for the text display window. You define the background color in the same way as in web pages, using a "#" character and six hexadecimal digits. |
Pause |
The speed of the animation is controlled with the Pause
parameter. For example,
<param name=Pause value=5> tells the CoolSlides to pause 5 seconds after each slide. You can set it to any positive integer number, from 0 to 32000000 seconds (which is more than a year). This pause time is multiplied by a factor of 2 each time the viewer click the "Slow" button to slow down the animation. It is divided by a factor of 2 each time the viewer click the "Fast" button to speed up the animation. |
Jump |
CoolSlides has a public variable, jArg, for controlling the display through outside
methods, such as a Javascript function. The input to this variable should be in the
format of three digits and an optional extension. The three digits is the slide
number you want CoolSlides to jump to. The extension can be the capital letter
"B", "F", or "P" to instruct CoolSlides to go backward, to go forward, or to pause
after displaying that slide. The extension letter is separated from the Slide number
by a hyphen.
You can set the jArg with simple methods like
<input type=button value="Slide 025" onClick="document.CoolSlides.jArg=025">
When this button is clicked, CoolSlides will jump to slide number 025.
Most of our Examples use a Javascript function Jump(arg) to pass the variable:
function Jump(arg) { document.CoolSlides.jArg=arg; }
This function simplified the codes when you want to call from many spots. At those
spots, such as image maps, buttons, hyper text, and so on, you can use onClick,
onMouseOver and similar methods to call Jump(arg). See the Example.html in the
download for fully implemented working examples.
If you have 50 slides numbered 000 to 050, you can use a button to jump to number 025:
<input type=button value="Slide 025" onClick=Jump('025')>
When a visitor click on the button, CoolSlides will play Slide 025 then scroll as
before. You can add an extension to the argument to further manipulate the direction
of the scrolling. Instead of Jump('025'), you can use:
|
| Home |IMG | URL | TXT |
Each slide can have three parameters, the IMG, the URL
and the TXT. Each parameter is preceded by a three digit slide number (any number
from 000 to 999). For example, slide number 120 may
have the parameters look like:
<param name=120IMG value="slides/photo1.jpg">
You can omit some parameters. If all parameters are omitted for a slide number, this
slide will be skipped.
|
|
IMG |
The IMG is used to load an image. For example,
<param name=120IMG value="slides/photo1.jpg">
tells the CoolSlides to display image file photo1.jpg from the
"slides" directory. Notice the sub directory, if
used, has to be relative. The image file must be in a sub directory of, or the same
directory as the CoolSlides.class file.
We suggest that you scale and crop your images so that they are in exactly the same
dimension as your image window. Try to reduce your image byte size. Many GIF
files can be compressed to JPG files of less than half the size but nearly the same
quality. You can do all this with an image processor, such as
ThumbsPlus,
Photoshop,
LView or
GIF Lube.
|
URL |
The URL for each slide can be set up with the URL
parameter. For example,
<param name=120URL value="http://www.CoolSlides.com/">
tells the CoolSlides to go to
www.CoolSlides.com if the viewer clicks on the display.
You may enter one URL for each slide. If the URL is omitted, the previous URL
is assumed. A click on any slide that does not have
a URL will activate the URL of the last slide that has a valid URL.
Make sure that you use full URL, like "http://www.CoolSlides.com/", not just
www.CoolSlides.com.
|
TXT | You can enter text to the
display window using the TXT parameter. Your text string can be divided into
multiple display lines each with its own color, such as:
<param name=131TXT value="#ff0000 CoolSlides PE
|#00ff00 for your web pages
|easy to use, fast loading|#0000ffOnly $49.00.">
You divide the lines with the "|" character. This example has four lines of text.
Notice that the whole string for the value has to be in quotation marks.
You can set the text color in the same way as in web pages, i.e. a "#" character with
six hexadecimal digits. This color change must at the start of the line.
The above example has a red line, two green lines, and a blue line of text.
The font size is automatically adjusted so that the first line and any new colored
line will fit the width of the description window. The third line here has no color
and font adjustment. To prevent it from running out of the window, the second line
is extended with blank spaces so that it is equal or longer than the third line.
|
|