Library code snippets

Animate Button

Following code is to develop different animated buttons using the tricks of CSS, Javascript and HTML. The code is effective for IE-5 and above. Developed by Peeyush Nigam (CEO-PARI WEB SERVICES™)

<Html>
<Head><Title>ANIMATED BUTTONS.</Title>
   <Style type="text/css">
   <!--
       .bt2class{    
           font-weight:bold;
           color:#ff0000;
           filter:blur();    
       }
   //-->
   </Style>    
<Script language="Javascript1.2">
<!--
   var ph=0;
   var dr=new Array(0,45,90,135,180,225,270,315);
   function animate(){
       bt2.filters[0].add=Math.round(1*Math.random());
       bt2.filters[0].direction=Math.round(dr[ph]*Math.random());
       var tm=window.setTimeout("animate()",1000);
       ph++;
       if(ph>=8){ph=0;}    
       
   }
//-->
</Script>
</Head>    
<Body onload="animate()">
Shiviring Button:<br>
<Input type="button" id="bt2" name="bt2" class="bt2class" value="Bring the Mouse Over Me."><br>
   
</Body>
</Html>

Comments

  1. 07 Apr 2002 at 13:01

    Very interesting effect. Nice work.

  2. 01 Jan 1999 at 00:00

    This thread is for discussions of Animate Button.

Leave a comment

Sign in or Join us (it's free).

AddThis

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.