This JavaScript code snippet enables you to have a dynamic button roll over effect without images.
This works in Internet Explorer only.

Example of roll over below:
( roll mouse over buttons )
Note: The links may not look correct on buttons & rollover due to our CSS file and the code you copy will look correct in your editor.

Insert this code into the Head section
( Instructions to configure script written within code, just read )

<script language="JavaScript" type="text/javascript">
/* 
These buttons may be freely used and modified as long as credit is given to 
William Platt of Dynomall Designs Inc. & http://www.DesignerWiz.com.  A link to HTTP://www.dynomall.com 
would surely be appreciated
User-friendly implementation by Howard Chen http://start.at/javascripts/
Provided By http://www.DesignerWiz.com
Free Complete Web Development Resource Center

NOTE: The script only works on IE.  You can still see the buttons all right in Netscape, but some color variables and the mouseOver effect will not work.
*/
buttons = new Array();
//================== EDITABLE VARIABLES =================
totalWidth = 500;               // The limit for the size of all the buttons' width add up together
buttonHeight = 25;              // The height of each button.
// Colors, can either use RGB hex code or simply name the color such as "white" or "red", etc.
buttonColorDark = "#000050";    // The color used for the darker section of the buttons (for 3D effect)
buttonColorLight = "#0000FF";   // The color used for the lighter section of the buttons (for 3D effect)
buttonBgColor = "#1205FA";      // The background color of the button
fontColor = "#00ff00F"           // The color of the text used in the buttons
// Button implementation format:
// buttons[x] = new Button("Title", "URL", "Size of Button Normal, "Size of Button MouseOver");
buttons[0] = new Button("Banner Maker", "www.designerwiz.com/resources/freeban.htm", 5, 2);
buttons[1] = new Button("JavaScripts", "www.designerwiz.com/JavaScripts/js_intro_welcome.htm", 5, 2);
buttons[2] = new Button("Yahoo", "http://www.yahoo.com/", 5, 2);
buttons[3] = new Button("Infoseek", "http://www.infoseek.com/", 5, 2);
//=============== DO NOT EDIT CODES BELOW THIS LINE ==============
function Button(title, link, borderBefore, borderAfter) {
this.title = title;
this.link = link;
this.borderBefore = borderBefore;
this.borderAfter = borderAfter;
}
function putButtonsHere() {
document.write('<div align="center">');
document.write('<table width="' + totalWidth + '" border="0" cellpadding="0" cellspacing="0">');
document.write('<tr>');
for (var i = 0; i < buttons.length; i++) {
document.write('<td>');
document.write('<a href="#" onmouseover="buttonlinks' + i + '.border=' + buttons[i].borderAfter + '" onmouseout="buttonlinks' + i + '.border=' + buttons[i].borderBefore + '">');
document.write('<table id=buttonlinks' + i + ' bgcolor="' + buttonBgColor + '" border="' + buttons[i].borderBefore + '" bordercolordark="'+ buttonColorDark + '" bordercolorlight="' + buttonColorLight + '" width=' + (totalWidth/buttons.length) + 'height=' + buttonHeight + '>');
document.write('<tr><td>');
document.write('<center><strong><a class="TButton" href="' + buttons[i].link + '">' + buttons[i].title + '</a></font></strong></center>');
document.write('</td></tr>');
document.write('</table>');
document.write('</a>');
document.write('</td>');
}
document.write('</tr>');
document.write('</table>');
document.write('</div>');
}
document.writeln('<STYLE TYPE=\"text\/css\">')
document.writeln('A.TButton {color:' + fontColor + '}');
document.writeln('<\/STYLE>')
//-->
</script>

Insert this code into the Body section
( where to appear )

Simply Cut and Paste Script code
Be sure to properly place script position directly into head & body of HTML

This script has been in the Dyno Mall.com Public Library.

Insert this code into the Head section( Instructions to configure script written within code, just read )

Insert this code into the Head section
( Instructions to configure script written within code, just read )