Button tips
********************************************
Free JavaScript provided by ©2003-VB'Breizh
**Updated (01/31/2004) Compatibility :
Formatted buttons with text (does'nt work with opera) :
Formatted buttons with text/picture/animated picture :
Bank
link
Blinking button :
Fading button (MSIE4 and above only) :
...Download the Css-JavaScript source code (5.02 kb)
<html><head> <style type="text/css"> .class1 {background-color:wheat; font-family:'comic sans ms'; font-size:14px; font-weight:bold; color:darkred; width:125px; cursor:hand;} </style> <script language="JavaScript"><!-- var run; var k=0; function run_blink() { if (document.getElementById('btn5').value=="") { document.getElementById('btn5').value="stop blinking...";} else {document.getElementById('btn5').value="";} run=setTimeout('run_blink()',500);k=1; } function cmd_blink() { if (k==1) { clearTimeout(run); document.getElementById('btn5').value="start blinking..."; k=0;} else {run_blink();} } var fade; var intensity=100; function cmd_fade() { intensity=intensity-5; if (intensity<0) { clearTimeout(fade); document.getElementById('btn6').blur(); alert('action...');} else { document.getElementById('btn6').filters.alpha.opacity=intensity; fade=setTimeout('cmd_fade()',100);} } function cmd_msg() { alert('Button formatted with text/css \n(cascading style sheets)'); } function run_button(nr) {alert('Button'+nr+' clicked');} --></script></head> <body bgcolor=lightyellow> <form name='form1'> Formatted buttons with text (does'nt work with opera) :<p><center> <input type=button name='btn1' id='btn1' style='background-color:wheat;font-family:arial;font-size:14px;font-weight:bold;color:darkred;width:125px;' onclick='cmd_msg()' value='Button1...'></button> <input type=button id='btn2' name='btn2' style='background-color:thistle;font-family:verdana;font-size:14px;font-weight:bold;color:blue;width:125px;cursor:hand;' onclick='cmd_msg()' value='Button2...'></button></center><hr> Formatted buttons with text/picture/animated picture :<p><center> <button id='btn0' name='btn0' style='cursor:hand' onclick='run_button(0)'>Bank <img src='icobank.jpg' border=0 alt='Page0' align=top></button> <button id='btn3' name='btn3' style='cursor:hand' onclick='run_button(3)'><img src='bzh00.gif' border=0 alt='Page3'></button> <button id='btn4' name='btn4' style='background-color:whitesmoke;cursor:hand;' onclick='run_button(4)'>link <img src='bzh05.gif' border=0 alt='Page4' align=bottom></button></center><hr> Blinking button :<p><center> <input type=button id='btn5' name='btn5' style='font-family:"arial black";font-size:14px;width:160px;cursor:hand;' value='start blinking...' onclick='cmd_blink()'></center><hr> Fading button (MSIE4 and above only) :<p><center> <input type=button name='btn6' style='filter:alpha(alpha.opacity=100);' class='class1' value='start fading...' onclick='cmd_fade()'></center></form><p> <hr><p><font size=1>Free JavaScript provided by ©2003-VB'Breizh<font size=2> <a href="http://gilles.saunier.free.fr"> WebSite</a> </body></html>
Comment, question ?
Button tips 
Button tips
...Download the Css-JavaScript source code (5.02 kb)
Comment, question ?