The PopUpMenuV3.2 java applet is a fully customizable Image
Map applet with pop up sub-menus and interactive image displays. Clickable areas can be in
the form of Rectangles, Circles or Polygons. The definition of each clickable area will
include the number of sub-menu items for this area (which can also be zero (0) for no
sub-menus), the area's shape and the coordinates that define the shape for this area.
Other optional parameters will define different images to show on mouse over, different
audio files to play on mouse over and the different colors and styles. It is less than 20k
so it downloads in about 6 seconds on a 28.8 connection. Version 3.2 fixes a bug in the
2.x version and adds new features.
The best thing about the applet is that it is so simple to configure, anybody with basic
html knowledge can add full inter-activity to his/her webpages in less 30 minutes.
Following are the parameters used by the applet. To use the different parameters in a html
file, you use the param tags. The param tags has two items incorporated in
them, the name item and the value item. The yellow
items are the possible name items for the param tags and the inside the
[brackets] you will find the possible value items for the param tag.
mapimage - [filename.jpg or filename.gif] - The
filename of the image map to be used. The image should be saved on the same directory as
the HTML and the applet, or can be in another path providing that you add the path in the
filename, i.e. "pathname\filename.jpg".
ink - [color] -The text color to be used for the
pop-up sub-menu items. A color could be any of the regular solid colors as 'white',
'black', 'blue', 'red', 'green', 'yellow', 'cyan', 'magenta', 'gray', 'pink', 'orange' or
the RGB definition of a color in either decimal numbers 'r,g,b' or in hexadecimal numbers
paper - [color] -The background color for the
highlight - [color] -The highlight color to be used
when the mouse is over a clickable item.
border - [size,color] - The pixel size of the
pop-up-box border and its color. This parameter is only used with the round or rect
styles which are the older versions styles. The new style default is the 3d which
is like the Windows pop-box style.
font - [face,style,size] - Recomended
font faces are Helvetica, TimesRoman, Courier, Symbol or Dialog.
Unlike the previous versions of the applet, you are not restricted to these faces and can
choose any other face you choose. Keep in mind that the visitor to your website should
have the face installed on his/her system in order to view it so you should always choose
a popular face. Style can be either plain, bold, italic or bolditalic.
style - [round, rect or 3d] - new in version 3.2 - This parameter will determine the style of the
pop-up-box. The default is now 3d which is very similar to the pop-up-boxes used in
Windows for speed-menus (when you Right-Click the mouse). The round style is the
old style used by the PopUpMenu applet versions 1.0 through 3.0 and the rect is very
similar to the round, but as the name implies, it has 90 degrees angles. Both the round
and rect styles use the border parameter.
align - [left or center] - new in version 3.2 - This parameter will determine the text
alignment in the pop-up-box. Default is left.
mark - [true or false] - new
in version 3.2 - This parameter will determine wether the clickable area (i.e.
rect, circ or poly) will be drawn in the highlight color when the mouse is in the area
boundry. Default is true.
area#1 .. area#n - [numberOfItems,shape,coordinate1,coordinate2,coordinte3..]
- The numberOfItems simply tells the applet how many menu items will be in the pop-up-box.
If you set it to zero (0) there will be no sub-menu items for this area but it will still
have a link, image and audio files. The shape can be either 'RECT' for rectangle, 'CIRC'
for a circle or 'POLY' for a polygon. The coordinates define the shape: A rectangle is
defined by four coordinates: [xStart,yStart,xEnd,yEnd], a
circle is defined by three coordinates: [xCenter,yCenter,radius] and
a polygon is defined by the number of coordinates it takes: [x1,y1,x2,y2,x3,y3,
.., .., xn,yn].
item#1-1 .. item#n-m - [text]
- The menu text item that will appear in the pop-up-box for area#n, item#m
url#1 .. url#n - [url] -
The default url for that area. A url can be either relative i.e. 'page2.html' or an
absolute address, like "http://www.dziners.com/main.html'.
url#1-1 .. url#n-m - [url]
- the url to go to on click for that specific sub-menu item, i.e. area#n item#m.
status#1 .. status#n - [text]
- The default message to show on the window bottom status bar for area#n, item#m.
image#1 .. image#n - [filename,
imageX, imageY] - The filename of the image to display when the
clickable area is active. Again the only supported file formats on the internet at this
time are the .jpg and the .gif formats. the imageX coordinate to display the image
at and the imageY coordinate to display the image at.
audio#1 .. audio#n - [filename.au]
- new in version 3.0 - The filename of the audio clip
to play when the mouse is over the clickable area. Per java support, the file has to be in
.au format and any sampling should be made in 8,000hz.
target - [text] - The target frame to send the browser
on upon mouse click. Defaults to "_self". If you have links to other websites
you might want to set the target to be "_blank" which will open a new browser
window and link on it.
target#1 .. target#n - [text] -
The target frame to send the browser on upon mouse click. Defaults to the text set in the
box#1 .. box#n - [boxX, boxY]
- new in version 3.2 - This parameter should be used with
extra caution (if at all). It is used to override the computer generated x and y
coordinates of the pop-up-box. The applet automatically calculates the position of the
box. There are only two cases when you might want to use this parameter: Either in order
to create a non-menu information box (as I used it in the example above for the FAQ item),
or if the box hides a part of your image map that you want visible at that time. The boxX
and the boxY will set the upper-left corner of the pop-up-box. The width and height
are still calculated auomatically according to the font size and the number of sub-menu
Download the Script