Нужно в объект засунуть процентное значение ключа

У меня есть вот такой код

gsap.to('.planet-man', {
    duration: 2,
    scrollTrigger: {
        trigger: '.we-do',
        start: 'top 25%',
        end: '70% 50%',
        scrub: 1,
        markers: true,
        toggleActions: 'reverse',
    },
    motionPath: {
        path: [
            {x: -30, y: 35},
            {x: -180, y: 70},
            {x: -180, y: 150},
            {x: -340, y: 250},
            {x: -410, y: 275},
            {x: -150, y: 310},
            {x: -500, y: 350},
            {x: -185, y: 600},
            {x: -270, y: 700},
            {x: -100, y: 820},
        ],
    }
});

Это для движения по скролу, но так как перемещение идет по пикселям - оно статично. Мне нужно X - задать процентное значение что бы таким образом оптимизировать его под многие экраны а не только под свой. Возможно мне подойдет функция которая динамически будет измерять ширину моего экрана и с подставление туда моих значений X, в соответствии с моим экраном к остальным.

$(window).resize(function () {
    $('.second-area').css('width', function () {
        const value = $('.second-area').css('width');
        console.log(value);
        // return value + "px";
    });
});

Вопрос как мне это сделать? ( Код с window.resize не обязателен, это просто то что у меня есть на данный момент. Важно лишь одно иксу, дать процентное значение. )


Ответы (1 шт):

Автор решения: Anatolii Basaraba

Все элементарно указать в процентах можно написав не просто x: а xPercent: 10 . Это будет +10 процентов по x. Или же просто x: '25%'что так же будет значить вправо на 25%. Все равно всем спасибо.

→ Ссылка