Использование JavaScript для увеличения значений top/left/bottom/right

Я пытаюсь увеличить положение элемента, скажем, x пикселей. Вот что я пробовал до сих пор:

var top = document.getElementById("something").style.top;
top = top + "300px"

Я знаю, что это не сработает, но мне было интересно, можно ли увеличить значение позиции таким образом.

Ответ 1

Поскольку style.top - это строка с единицами на конце, как "300px" вы можете делать только математику с ней, когда вы конвертируете только числовую часть в фактическое число.

Предполагая, что у вас есть позиционный элемент (поэтому установка top значения будет что-то делать), и у вас уже есть top стиль, установленный непосредственно на элементе и не установленный через CSS (поэтому получение obj.style.top фактически приведет к вам что-то), вы можете сделайте это, проанализировав номер из значения стиля следующим образом:

var obj = document.getElementById("something");
var topVal = parseInt(obj.style.top, 10);
obj.style.top = (topVal + 300) + "px";

Рабочий пример: http://jsfiddle.net/jfriend00/pt46X/

Ответ 2

Это не сработает, потому что, например, если top имеет значение 200px, он станет "200px300px". Попробуй это:

var elem = document.getElementById("something");
elem.style.top = parseInt(elem.style.top, 10) + 300 + "px"

Демо WEEEE !!!!