Teach Yourself SunSoft Java WorkShop in 21 Days

Featured Applets

SmartMap, an image map and text display applet, superimposes text over an image depending on where the mouse is located. It uses the same COORDS and HREF attributes of the HTML extensions for client-side image maps, and adds a TEXT attribute for a cutline that is displayed atop the image until the mouse is moved out of the cutline's mapping.

In order to display the text, SmartMap uses a new class called Cutline. The Cutline class that takes a line of text and can display it in a box, with the text separated over up to five different lines. The font, font size, and font style all are configurable.

For this demonstration, SmartMap uses a map from The Dargon Project, the longest running fantasy fiction anthology on the Internet.

Click the image below for an example of the applet in action.

To use SmartMap on a web page, two class files should be placed on your web site: SmartMap.class and Cutline.class. The image file to display also should be placed on your site. The three files should be placed in the same directory as the web page, or should be placed in a subdirectory listed in the CODEBASE parameter of the APPLET tag. The CODE tag should be "SmartMap.class".

SmartMap has seven or more parameters that can be customized within the APPLET tag, as follows:

• image: the file name of the image to display
• coords1: the x1,y1 and x2,y2 coordinates of image map item 1 (for example, "50,50,200,200" will create a rectangular image map with (50,50) as the upper left corner and (200,200) as the lower right corner)
• coords#: the x1,y1 and x2,y2 coordinates of image map item # (where # is a number from 1 to 30)
• text1: the text to display when the image is over map item 1
• text#: the text to display when the image is over map item # (where # is a number from 1 to 30)
• href1: the URL, if any, to load when the mouse is clicked while over map item 1
• href#: the URL, if any, to load when the mouse is clicked over map item # (where # is a number from 1 to 30)
• font: the name of the font to use for text ("Arial" is the default)
• fontSize: the size of the font to use (12 is the default)
• fontStyle: the style of the font to use ("BOLD", "ITALIC", or normal if left off)

The source code and class files of this applet are available.

Return to Main Page