Example 2
Adding Icon Images to the Buttons

In this example we build upon the first example by adding icon images to each of the buttons. Here we will add two images to each button, one to be displayed when the button is in it's normal state and the second to be displayed when the mouse passes over the button. A third image could also be added which would be displayed on a mouse click event. In this case we leave this empty and the mouse click image will default to the mouse over image.

And here is the html code,

<applet code="MenubarApplet" archive="AdvMenubar.jar" width="300" height="30" mayscript>
<param NAME="cabbase" VALUE="AdvMenubar.cab">

<param name="backgroundColor" value="0,0,0">

<!-- Menu's -->
<param name="menu1" value="root|100|30|0|255,255,255">

<!-- Item's -->
<!-- Menu Id | Submenu Id | Background color | Arrow color | Divide line | Mouseover bg color | Mouseover text color | Mouseover effect | Mouseclick bg color | Mouseclick text color | Mouseclick effect | Border effect | Normal image | Mouseover image | Mouseclick image | Image position | Item text | Text position | Text color | Text font | Url | Target frame | Sound - Submenu open | Sound - Submenu close | Sound - Button click | Status bar message -->

<param name="item1" value="root| |57,156,255|0,64,128|false|0,97,193|170,213,255|2|0,97,193|170,213,255|0|1|home|home2| |3,3|Item One|30,20|0,64,128|Helvetica,N,12">
<param name="item2" value="root|submenu|57,156,255|0,64,128|false|0,97,193|170,213,255|2|0,97,193|170,213,255|0|1|online|online2| |3,3|Item Two|30,20|0,64,128|Helvetica,N,12">
<param name="item3" value="root| |57,156,255|0,64,128|false|0,97,193|170,213,255|2|0,97,193|170,213,255|0|1|select|select2| |3,3|Item Three|30,20|0,64,128|Helvetica,N,12">

<!-- Images -->
<param name="image1" value="home|./IconImages/home.gif">
<param name="image2" value="home2|./IconImages/home2.gif">
<param name="image3" value="online|./IconImages/online.gif">
<param name="image4" value="online2|./IconImages/online2.gif">
<param name="image5" value="select|./IconImages/select.gif">
<param name="image6" value="select2|./IconImages/select2.gif">

</applet>

 

Next Example - Click Here.