Reputation: 61
I have this really fundamental question, but I have no idea wheres the problem.
Here's fiddle: http://jsfiddle.net/nL6fvrz8/
I just simply want to move the object to the right with this js, but when I do that in the fiddle it doesnt move at all and if I do it on my computer, it keeps giving me the primary position of the 200px(the amount i want to add it to its first position)
function doMove(){
var foo = document.getElementById("foo");
foo.style.left = (foo.style.left + 200) + 'px';
}
I know its prolly a little simple, but im clueless. Thanks for your help.
Upvotes: 0
Views: 67
Reputation: 2520
Define basic position in JS as well, and add parseInt when reading style (left is string in format like this 200px
).
document.getElementById("foo").style.left = "300px";
function doMove() {
var foo = document.getElementById("foo");
foo.style.left = (parseInt(foo.style.left) + 200) + 'px';
}
Upvotes: 0
Reputation: 208032
Only inline styles can be referenced via the x.style
syntax. To get styles set via a style sheet, use getComputedStyle
:
function doMove() {
var elem = document.getElementById("foo");
var foo = window.getComputedStyle(elem, null).getPropertyValue("left");
elem.style.left = parseInt(foo,10) + 200 + 'px';
}
Upvotes: 3