Here are a few more animated buttons using CSS, Javascript and DHTML to create new more interactive & cool Form Button controls. Remember the code is best suited for only IE-5.5 and above.
<Html>
<Head><Title>Few More ANIMATED BUTTONS.</Title>
<Style type="text/css">
<!--
Body{
font-size:11px;
font-family:arial;
}
.bt2class{
font-weight:bold;
color:#ff0000;
font-size:11px;
font-family:verdana;
filter:wave(add=1);
border-color:#f3f2f2;
}
.bt3class{
font-weight:bold;
color:#ff0000;
font-size:11px;
font-family:verdana;
filter:blendTrans();
}
//-->
</Style>
<Script language="Javascript1.2">
<!--
var ph=0,op=0;
var dr=new Array(0,1,2,3);
function animate(){
bt2.filters[0].phase=Math.round(100*Math.random());
bt2.filters[0].freq=Math.round(20*Math.random());
var tm=window.setTimeout("animate()",200);
ph++;
if(ph>=3){ph=0;} if(op>=100){op=0;}
}
function animatebt3(){
if(animatebt3.arguments.length>0){
animatebt3.arguments[0].filters[0].play();
}
}
//-->
</Script>
</Head>
<Body onload="animate()">
<u>Another Animated Button by Peeyush :</u><br><br>
<Input type="button" id="bt2" name="bt2" class="bt2class" value="BRING THE MOUSE OVER ME."><br><br>
<u>One more for u :</u><br>
Just bring the mouse over the button to see the effect and remove the pointer from the button to cancel the effect.<br>
<br>
<Input type="button" id="bt3" name="bt3" class="bt3class" value="BRING THE MOUSE OVER ME. and wait"><br>
<Script for=bt3 Event=onMouseOver Language="JavaScript">
<!--
animatebt3(bt3);
//-->
</Script>
<Script for=bt3 Event=onMouseout Language="JavaScript">
<!--
location.reload();
//-->
</Script>
<br><br><br><br><br><br><Hr color="#f3f2f2">
© PARI WEB SERVICES™
</Body>
</Html>
Comments