Как вы получаете внутреннюю высоту элемента, без заполнения и границ?
Нет jQuery, только чистый JS и кросс-браузерное решение (включая IE7)
Как вы получаете внутреннюю высоту элемента, без заполнения и границ?
Нет jQuery, только чистый JS и кросс-браузерное решение (включая IE7)
var style = window.getComputedStyle(document.getElementById("Example"), null);
style.getPropertyValue("height");
Вышеприведенная версия будет работать в современных браузерах. Пожалуйста, проверьте currentStyle
для браузеров IE.
ИЗМЕНИТЬ из комментариев:
http://jsfiddle.net/hTGCE/1/ (тогда ожидается немного больше кода)
в Интернете вы найдете такие функции:
function getRectangle(obj) {
var r = { top: 0, left: 0, width: 0, height: 0 };
if(!obj)
return r;
else if(typeof obj == "string")
obj = document.getElementById(obj);
if(typeof obj != "object")
return r;
if(typeof obj.offsetTop != "undefined") {
r.height = parseInt(obj.offsetHeight);
r.width = parseInt(obj.offsetWidth);
r.left = r.top = 0;
while(obj && obj.tagName != "BODY") {
r.top += parseInt(obj.offsetTop);
r.left += parseInt(obj.offsetLeft);
obj = obj.offsetParent;
}
}
return r;
}
если вы хотите вычесть, padding/border-width устанавливается в css файле, а не динамически в атрибуте style:
var elem = document.getElementById(id);
var borderWidth = 0;
try {
borderWidth = getComputedStyle(elem).getPropertyValue('border-top-width');
} catch(e) {
borderWidth = elem.currentStyle.borderWidth;
}
borderWidth = parseInt(borderWidth.replace("px", ""), 10);
и с заполнением то же самое. то вы его вычисляете.
У меня была та же проблема, и выяснилось, что нет никакого нативного крестообразного решения, но решение легко, хотя
var actual_h = element.offsetHeight;
if(parseInt(element.style.paddingTop.replace('px','')) > 0){
actual_h=actual_h - parseInt(element.style.paddingTop.replace('px',''));
}
if(parseInt(element.style.paddingBottom.replace('px','')) > 0){
actual_h=actual_h - parseInt(element.style.paddingBottom.replace('px',''));
}