Advanced Search

Animating Shapes

/ Published in: JavaScript
Save to your folder(s)
Changes shape back and forth from a round element to a square element.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. BR=0;
  2. el=false;
  3. incr=0;
  4. function doOneLoop(x,i)
  5. {
  6.     x.style.borderRadius=BR+'%';
  7.     BR+=i;
  8.     incr=(BR<5) ? 5 : i;
  9.     if (BR<55) tout=setTimeout('doOneLoop(el,incr)',200);
  10.  }
  11. function doOne()
  12. {
  13.     el=document.getElementById('fx1');
  14.     BR=50;
  15.     incr=-5;
  16.     tout=setTimeout('doOneLoop(el,incr)',100);
  17. }

URL: http://coboldinosaur.com/pages/shapes-art.html

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.