I made this applet to have a cool effect on Pterodattilo web site (that is
this site!).
The applet resizes a set of input images to its dimensions and then cycles through them. Input images are passed
to the applet through parameters, starting from "image1", to "image2" ... to "imagen".
Here is a code snippet: applet loads 6 images and cycles through them with a period of
3 seconds, clicking on the applet makes your browser to go to the web page specified in "link" while target frame is
specified in "frame":
<applet code="javaUtils.SlideImagesApplet.class" archive="slideImages.jar" height="180" width="200">
<param name="image1" value="Archeology/mont_alb_map.jpg" />
<param name="image2" value="Archeology/zona_oaxaca_map.jpg" />
<param name="image3" value="Archeology/maya_map.jpg" />
<param name="image4" value="Archeology/tikal_map.jpg"/>
<param name="image5" value="Archeology/Cartina_palenque.jpg"/>
<param name="image6" value="Archeology/palenque_map.jpg"/>
<param name="sleep" value="3000" />
<param name="link" value="Archeology/archeology.html">
<param name="frame" value="bottom">
<param name="background" value="#f4ffe4">
</applet>
Also, applet does not simply show the next image after "sleep" ms time. It supports different effects to switch from
one image to the following.
The effect can be chosen with the "transition" parameter which can have 5 values:
- none: simply load another image and show it
- fade: current image fades and next one appear progressively
- scrollh: current image scrolls horizontally from left to right leaving space for the next one
- scrollv: as above but scroll is vertical
- tent: it creates the effect of a curtain that opens showing the next image. Curtain can be composed
by two parts or a single one coming either from right or from left side of the image depending on "tentleft" and "tentright" parameter values which
select the images composing it.
Too words, in my opinion, everything is better explained with the complete list of paramters and some examples:
| Parameter | Allowed values | Description |
| image1 | image filename | First image of the show to be loaded |
| image2 | image filename | Second image of the show to be loaded |
| imagen | image filename | Nth image of the show to be loaded: parameters must be all present starting from image1 to imagen to have n images loaded and cycling in the applet |
| sleep | integer | Amount of time, in milliseconds, an image is shown before changing |
| link | url | Target page when clicking on the applet |
| frame | url | Target frame when clicking on the applet |
| background | HTML color | background color of the applet (used only for "fade" transition, see below) |
| transition | none, fade, scrollh, scrollv, tent | Type of transition between two images (see below) |
| tentleft | image filename | Left part of "tent" when transtion is tent |
| tentright | image filename | Right part of "tent" when transtion is tent |
|
|
|
<applet code="javaUtils.SlideImagesApplet.class"
archive="slideImages.jar" height="150" width="150">
<param name="image1" value="p.jpg" />
<param name="image2" value="t.jpg" />
<param name="image3" value="e.jpg" />
<param name="image4" value="r.jpg" />
<param name="image5" value="o.jpg" />
<param name="image6" value="d.jpg" />
<param name="image7" value="a.jpg" />
<param name="image8" value="t.jpg" />
<param name="image9" value="t.jpg" />
<param name="image10" value="i.jpg" />
<param name="image11" value="l.jpg" />
<param name="image12" value="o.jpg" />
<param name="sleep" value="1000" />
<param name="background" value="#f4ffe4"/>
</applet>
|
<applet code="javaUtils.SlideImagesApplet.class"
archive="slideImages.jar" height="150" width="150">
<param name="image1" value="p.jpg" />
<param name="image2" value="t.jpg" />
<param name="image3" value="e.jpg" />
<param name="image4" value="r.jpg" />
<param name="image5" value="o.jpg" />
<param name="image6" value="d.jpg" />
<param name="image7" value="a.jpg" />
<param name="image8" value="t.jpg" />
<param name="image9" value="t.jpg" />
<param name="image10" value="i.jpg" />
<param name="image11" value="l.jpg" />
<param name="image12" value="o.jpg" />
<param name="sleep" value="1000" />
<param name="transition" value="fade"/>
<param name="background" value="#f4ffe4"/>
</applet>
|
|
|
<applet code="javaUtils.SlideImagesApplet.class"
archive="slideImages.jar" height="150" width="150">
<param name="image1" value="p.jpg" />
<param name="image2" value="t.jpg" />
<param name="image3" value="e.jpg" />
<param name="image4" value="r.jpg" />
<param name="image5" value="o.jpg" />
<param name="image6" value="d.jpg" />
<param name="image7" value="a.jpg" />
<param name="image8" value="t.jpg" />
<param name="image9" value="t.jpg" />
<param name="image10" value="i.jpg" />
<param name="image11" value="l.jpg" />
<param name="image12" value="o.jpg" />
<param name="sleep" value="1000" />
<param name="transition" value="scrollv"/>
<param name="background" value="#f4ffe4"/>
</applet>
|
|
|
|
<applet code="javaUtils.SlideImagesApplet.class"
archive="slideImages.jar" height="150" width="150">
<param name="image1" value="p.jpg" />
<param name="image2" value="t.jpg" />
<param name="image3" value="e.jpg" />
<param name="image4" value="r.jpg" />
<param name="image5" value="o.jpg" />
<param name="image6" value="d.jpg" />
<param name="image7" value="a.jpg" />
<param name="image8" value="t.jpg" />
<param name="image9" value="t.jpg" />
<param name="image10" value="i.jpg" />
<param name="image11" value="l.jpg" />
<param name="image12" value="o.jpg" />
<param name="sleep" value="1000" />
<param name="transition" value="tent"/>
<param name="tentleft" value="tentleft.jpg"/>
<param name="tentright" value="tentright.jpg"/>
<param name="background" value="#f4ffe4"/>
</applet>
|
|
|
<applet code="javaUtils.SlideImagesApplet.class"
archive="slideImages.jar" height="150" width="150">
<param name="image1" value="p.jpg" />
<param name="image2" value="t.jpg" />
<param name="image3" value="e.jpg" />
<param name="image4" value="r.jpg" />
<param name="image5" value="o.jpg" />
<param name="image6" value="d.jpg" />
<param name="image7" value="a.jpg" />
<param name="image8" value="t.jpg" />
<param name="image9" value="t.jpg" />
<param name="image10" value="i.jpg" />
<param name="image11" value="l.jpg" />
<param name="image12" value="o.jpg" />
<param name="sleep" value="1000" />
<param name="transition" value="tent"/>
<param name="tentleft" value="background.jpg"/>
<param name="background" value="#f4ffe4"/>
</applet>
|