Melferas Melferas - 1 year ago 67
HTML Question

Animation in JS won't move

I've been several hours trying to make a

block move left via JavaScript, then go back to original position. Not a chance.

This is the code:


var block= null;

function init() {
block= document.getElementById('myDiv');

function move() { = parseInt( + 10 + 'px';

if(parseInt(>=600) { = 12;


window.onload = init;


<div id="myDiv" onload="move();">
<img src="image.png" id="anImage" >


#myDiv {
position: absolute;
bottom: 40%;
left: 100px;
border: 3px solid black;

What you see in the code are all the elements (and their styles) involved in this. The js file is loading correctly and works with other functions (changing the image inside the div, etc...).

If you see any mistakes I made please point them to me. It's my first moving animation and it can't just make it work.

Ps: It should work just with this so I'm not going to use jQuery.

Answer Source

Add move(); to your init function:

function init() {
  block= document.getElementById('myDiv');

Change your move() function as follows:

function move() { =  parseInt(block.offsetLeft, 10) + 10 + 'px';

  if(parseInt(block.offsetLeft, 10)>=600) { = '12px';


Working fiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download