mbossed Button Bar These two vertically oriented button bar examples use embossing to create the base button state. Try moving your mouse over the buttons and clicking on the buttons (clicking on the buttons will not cause a URL to load in this example). Notice that the text in the browser's status bar changes as the mouse is moved over each button.
	The two button bars shown above use identical parameters (see below for complete parameter details), except that the button bar on the right has the parameter "drawGrayBase" set to "false" (it is "true" -- the default value -- for the bar on the left) and it also uses a value of "200" for the "embossBrightness" parameter (the bar on the left uses "150"). In addition to the parameter value differences, the button bar on the left uses a little trick to create the "mouseOver" image. In this example, there are no special attributes for the "mouseOver" button state -- it is identical to the "base" button state. Since there is no difference between the two states, the applet uses the base state for the mouseOver state in addition to using it for the base state. Since we told the applet to emboss the base state, it follows that the mouseOver state will also appear embossed (since both states use the same image). By default, the applet converts the base state to grayscale so we end up with an embossed grayscale image for the base state, and an embossed normal (non-grayscale) image for the mouseOver state. In this instance, we do not want an embossed image for the mouseOver state -- we would prefer to have a regular image instead. In order to do this, we "trick" the applet into creating a normal image by using the "button1TextOver" parameter and assigning it the same text as the "button1Text" parameter. This forces the applet to create a normal (un-embossed) mouseOver button image. Most of the time you will not need this little trick, but it doesn't hurt to keep it in mind for the times that it could be useful. If the Java class files are located in the same directory as the HTML, then the complete applet tag would be defined as illustrated below. Click on the PARAM name for detailed information about the parameter. <APPLET CODE="TextURLButtonBar.class" WIDTH="90" HEIGHT="112" HSPACE="5"> <PARAM NAME="disableBadURL" VALUE="false"> <PARAM NAME="buttonBorders" VALUE="all"> <PARAM NAME="borderSize" VALUE="2"> <PARAM NAME="downShift" VALUE="true"> <PARAM NAME="downShiftAmt" VALUE="1"> <PARAM NAME="embossBase" VALUE="true"> <PARAM NAME="embossContrast" VALUE="19"> <PARAM NAME="embossBrightness" VALUE="150"> <PARAM NAME="color" VALUE="7D3B9D"> <PARAM NAME="fontColor" VALUE="76ABD9"> <PARAM NAME="fontColorDown" VALUE="DEFFFD"> <PARAM NAME="fontSize" VALUE="14"> <PARAM NAME="fontStyle" VALUE="bold"> <PARAM NAME="button1Text" VALUE="Home"> <PARAM NAME="button1TextOver" VALUE="Home"> <PARAM NAME="button1Start" VALUE="0"> <PARAM NAME="button1Size" VALUE="28"> <PARAM NAME="button1Desc" VALUE="Return to the Home Page"> <PARAM NAME="button2Text" VALUE="Java"> <PARAM NAME="button2Start" VALUE="28"> <PARAM NAME="button2Size" VALUE="28"> <PARAM NAME="button2Desc" VALUE="Jump to the Java Page"> <PARAM NAME="button3Text" VALUE="Links"> <PARAM NAME="button3Start" VALUE="56"> <PARAM NAME="button3Size" VALUE="28"> <PARAM NAME="button3Desc" VALUE="Display Links to Related Sites"> <PARAM NAME="button4Text" VALUE="Contacts"> <PARAM NAME="button4Start" VALUE="84"> <PARAM NAME="button4Size" VALUE="28"> <PARAM NAME="button4Desc" VALUE="How to Contact Us"> </APPLET>
	otes on the Applet Parameters The height and width values in the applet tag determine the height and width of button bar. The use of the Button1TextOver parameter with the same text as the Button1Text parameter is explained in the text above. The disableBadURL parameter is used so that you can click the buttons without having a page load over the example. Normally you would want to specify URLs for the buttons and omit the disableBadURL parameter.
Copyright © 1997 by Modern Minds, Inc.