Как я могу использовать переменную, чтобы изменить тип стиля CSS, используя JavaScript

Question

Я создал эту функцию Vanilla Javascript для эффекта параллакса на целевой странице моего сайта, и она довольно эффективна, но может быть на шаг лучше.

function parallaxTop(direction, id, startingNumber, scrollVariable){
    var scrolled = window.pageYOffset;
    var element = document.getElementById(id);
    element.style.top = (startingNumber + (scrolled * scrollVariable)) + 'px';
}

function parallaxLeft(direction, id, startingNumber, scrollVariable){
    var scrolled = window.pageYOffset;
    var element = document.getElementById(id);
    element.style.left = (startingNumber + (scrolled * scrollVariable)) + 'px';
}

window.onscroll = function() {
    parallaxTop('element1', 0, 0.5);
    parallaxLeft('element2', 200, -0.25);
}

Я хочу знать, могу ли я использовать переменную для выбора типа атрибута css, который будет изменен. Это было бы моим лучшим предположением, но я не могу найти решение.

function parallax(direction, id, startingNumber, scrollVariable){
    var scrolled = window.pageYOffset;
    var element = document.getElementById(id);
    element.style.direction = (startingNumber + (scrolled * scrollVariable)) + 'px';
}

window.onscroll = function() {
    parallax('top','element1', 0, 0.5);
}

Answer 1

Вы должны изменить это

element.style.direction = (startingNumber + (scrolled * scrollVariable)) + 'px';

на

element.style[direction] = (startingNumber + (scrolled * scrollVariable)) + 'px';