Library code snippets
Animated Buttons
By Peeyush Nigam, published on 08 Apr 2002
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>
Related articles
Related discussion
-
problem i refreshing the parent page when the popup/child page done the server side processing and closes itself
by joydeep157 (0 replies)
-
How can I execute server-side function using asp.net Ontextchanged orJavascript onchange?
by konikula (6 replies)
-
RadioButton inside Repeater with Javascript
by Aquila (1 replies)
-
save .csv with newline character
by James Crowley (1 replies)
-
Header and Footer in Web page print
by fhajaj (4 replies)
Related podcasts
-
Episode 27: What Every Web Developer Needs To Know
Kevin leads a discussion on what every web developer needs to know. Topics Javascript - language or toolkits? Does clean HTML matter? What are the tangible benefits? Working with designers who only speak Photoshop Basic usability Tools every web developer needs Progressive enhancement K. Scott i...
Events coming up
-
Dec
8
Web Design World
Boston, United States
Join your colleagues and top experts in the Web field as Web Design World returns to Boston December 8-10, 2008 for three dynamic days of information, interaction, insight and inspiration.
[1] [/1] Although the buttons work perfectly when put in -as soon as I wrap a hot spot around them they no longer press.Anyone know a way round this,please
I develop webpages using ASP.NET but I don't know what are the files I have to upload in Remote server to view my page in Internet
Please Help Me soon
Thank you for the button code. I've been trying to get a simple button code that works for some time and yours does.
gell
This thread is for discussions of Animated Buttons.