Image Buttons

Problem:

Is there a way to get rid of the Gray buttons and use Images instead?

Solution:

1. Create a button in the Studio.
   
   
2. Select the new button object from the project browser. This will update the Properties Inspector with the properties for the button.
   
   
3. Change the 'Type' property (near the bottom of the list) to 'image'
   
   
4. Change the 'Picture' property to the image. This should be referenced to document root for the web server. (For instance, if the image can be referenced by http://mydomain/graphics/whatever.gif, the image property value should be set to /graphics/whatever.gif)
   
   
5. If you want to get rid of the border, modify the ExtraHtmlText property to say "BORDER=0" (without the quotes)

Note that Netscape and IE will, by default, show the name of the button when the cursor is placed over the button. Since ND uses the name of the button to define what method is to be called next, this can cause some pretty nasty text to be displayed over an image button. Unfortunately, the HTML standard does not support the 'ALT' tag as it does with images.

However, IE has offered the ability to use the ALT tag for image buttons anyway. Therefore, adding ALT="My Button" to the ExtraHtmlText property value will enable IE to show "My Button" when the cursor is placed over the image button (rather than "btn_MyButton_onWebEvent(btn_MyButton)", which is what Netscape will display regardless.)