Javascript - style.left will update for subtraction but not addition

Question

function moveLeft(obj){ 
    obj.style.left = parseInt(obj.style.left) - 0.5 + "%";
}

function moveRight(obj){
    obj.style.left = parseInt(obj.style.left) + 0.5 + "%";
}

The code here is supposed to move my image object to the left and to the right by updating percentages instead of pixels. moveLeft works but moveRight doesn't. Is it something to do with associativity?

score 0 · Answer 1 · answered Jul 30 '13 at 22:26

0

function moveRight(obj){
    obj.style.left = parseInt(obj.style.left) + 0.5 + "%";
}

You use style.left instead of style.right

answered Jul 30 '13 at 22:26

webenter

13
3

Tried that, no difference in output :( – keycoder Jul 30 '13 at 22:28

score 0 · Accepted Answer · answered Jul 30 '13 at 22:40

The problem is that when you call parseInt() it returns the value rounded down. So you're actually not moving by half percent, but one percent. This way, the best solution is to increment in 1 on every step:

function moveLeft(obj){ 
    obj.style.left = (parseInt(obj.style.left, 10) - 1) + "%";
}

function moveRight(obj){
    obj.style.left = (parseInt(obj.style.left, 10) + 1) + "%";
}

Javascript - style.left will update for subtraction but not addition

2 Answers2