Jump to content

Animation - document.getElementById.style


Omirion

Recommended Posts

Hi,

Currently experimenting with animation using JavaScript.

This is my code.

 

<script language="JavaScript" type="text/javascript">
var moo = 200;

function Change()
{
while(moo>100){
document.getElementById("test").style.left = moo;
    moo--;
}
}

</script>

 

The problem is it isn't animating and just going to x=100.

Any ideas on how i can get a sort of tween animation out of this.

 

Like say have the loop run every 10ms until it reaches x=100?

Link to comment
https://forums.phpfreaks.com/topic/191957-animation-documentgetelementbyidstyle/
Share on other sites

You need use setInterval or recursion

 

<script type="text/javascript">
var moo = 200;
function Change() {
  if(--moo < 100) return
  document.getElementById("test").style.left = moo +'px';
  setTimeout(arguments.callee, 100)
}
Change()
</script>

 

 

 

<script language="JavaScript" type="text/javascript">

«language» is depricated attribute.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.