Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Получение вычисленного значения css свойства (https://javascript.ru/forum/jquery/27262-poluchenie-vychislennogo-znacheniya-css-svojjstva.html)

FanAizu 07.04.2012 14:04

Получение вычисленного значения css свойства
 
Как получить вычисленное значение css свойства? Мне нужно получить значение line-height. В css файле оно задано как normal, и метод css() в некоторых браузерах так и возвращает 'normal', а мне нужно вычисленное значение. Какой метод возвращает вычисленные значения? Спасибо.

Greck 09.04.2012 10:37

Посмотрите что возвращает:
[window.]document.getElementById("elementID").style.lineHeight


Если так же, то боюсь все плохо. Вычислять высоту строки по формуле:
(высота элемента-паддинг)/количество строк

Не знаю, как-то слишком нетривиально и можно не учесть все моменты, то есть будет глючить. Лучше просто обойтись без этого свойства.

Sigak 12.03.2014 20:30

Понимаю, что уже 100 лет прошло, но может еще кому пригодиться:

"Вычислять высоту строки по формуле..." - самый точный способ. Даже не зная количества строк, можно, например, так:

function calculateLineHeight(element) {      
var p = document.createElement('p');
p.appendChild(document.createTextNode('T'));
p.style.padding =  '0px';
p.style.visibility = 'hidden';
element.appendChild(p);
var h = p.clientHeight; 
element.removeChild(p);
return h;  
}

Если все-таки нужно сделать через метод css(), то погуглив, находим вот это:

"normal — межстрочное расстояние вычисляется браузерами исходя из размера шрифта элемента. Как правило, оно равно размеру шрифта или больше его на 20%."

Опытным путем вычислено, что IE 11 прибавляет не 20, а около 15%.
Получаем следующее:

var $p = $('selector');
var h = parseInt($p.css('lineHeight')) || parseFloat($p.css('fontSize')) * 1.15 ^ 0;


Часовой пояс GMT +3, время: 16:17.