Как получить свойство css width в процентах?

Question

[Данил Сысоев]

Ребят, всем привет. В общем столкнулся с такой проблемой.
Дело в том, что мне нужно не просто перевести свойство в проценты, а получить в процентах именно тогда, когда оно задано в процентах.
Например есть функция:

function getStyles(el) {
    width = $(el).css('width');
    resultStyle = el + '{' +  'width:' + width + ';' +'}';
    return resultStyle;
}

И если в элементе изначально задано значение в пикселях, то вернуть в пикселях, а если в процентах, то соответственно.
На данный момент же, если у блока 100% ширина, то он возвращает её в зависимости от того какая на данный момент ширина экрана в пикселях. Просьба направить меня в нужную сторону, в решении этого вопроса.
Заранее спасибо.

Answer 1

[Exploding]

Берем еще впридачу ширину #2 и считаем... Не умеет jq процентами орудовать.
Может быть скорее всего и плагины для разных людей придумали, но как по мне, подключать и возиться с плагином вместо того чтобы одну строку лишнюю написать - неоправданный ...изм.

Comments

[Данил Сысоев]

Не совсем понял понял про ширину #2, вы имеете ввиду ширину экрана?

[Exploding]

Данил Сысоев: Ну если Вам нужны проценты относительно экрана, то экрана. А если относительно другого элемента, то ширину другого элемента:)

[Данил Сысоев]

А, вариант хороший, но тогда если ширина изначально задана в пикселях, то он её перегонит в проценты.

[Exploding]

Данил Сысоев: кто?

[Kovalsky]

Данил Сысоев: в том-то и фишка, что никто за вас ничего в проценты перегонит, это надо вручную делать: someValue / someOtherValue + '%'

[Данил Сысоев]

Exploding: Код, который будет определять ширину в процентах.
То есть мы берем ширину родителя - x и ширину элемента - y.
y/x*100 - получается ширина в процентах.
То есть код условно будет такой:

function getStyles(el) {
    width1 = Number($(el).css('width'));
    width2 = Nubmer($(el).parent().css('width'));
    width = width1/width2*100;
    resultStyle = el + '{' +  'width:' + width + ';' +'}';
    return resultStyle;
}

Функция изначально возвращает стиль элемента. То есть ширина даже если зада в пикселях, то после манипуляций выше, она вернется в процентах.

[Данил Сысоев]

Никита Полевой: я это и пытаюсь донести, то что мне нужно чтобы он автоматически отличил входное значение px от %

[Exploding]

Данил Сысоев: ну так метод .width(); вроде бы ж всегда возвращает значения в рх

[Kovalsky]

Данил Сысоев: а, ну да, если вы даже его написали, тогда да, он конечно будет всё делать.

[Данил Сысоев]

Exploding: так и есть. А нужно было чтобы в процентах, если в стилях она указана в процентах.
Решил проблему так. Указал в атрибуте style, ширину и вот таким образом он возвращает в процентах:

function getStyles(el) {
    width = $(el).get(0).style.width;
    if (width == '') width = $(el).css('width');
    resultStyle = el +
        '{' +
        'width:' + width + ';' +
        '}';
    return resultStyle;
}

[Exploding]

Данил Сысоев: не обязательно. Я ж говорю, метод .width() возвращает (должен по крайней мере) ширину в рх не зависимо от того что там и в чем у элемента указано, или вообще не указано.