объект style в IE8
В IE8 нельзя поменять css-свойства через объект style, если они не заданы inline'во:
<div id="test">...контент...</div>
<script>
var div = document.getElementById("test");
try {
div.style.height = 500 + "px";
}
catch(e) {
div.setAttribute("style", "height:500px");
</script>
Из-за этого изменение высоты через style выдаёт ошибку(предупреждение) в IE8 в строке состояния, но при этом это не фатал еррор, то есть исполнение кода продолжается. Пробую через try-catch изменить высоту через setAttribute, но почему-то не хочет работать. Как можно решить эту проблему? |
Если добавить в конце нехватающую фигурную скобку, то в IE11 в режиме эмуляции IE8 ваш пример прекрасно работает
|
Цитата:
Объект currentStyle, через который получают значения css-свойств в IE8, возвращает, в отличии от getComputedStyle, не вычисленное значение блока, а то которое было прописано в стилях. Если в стилях его нет, то он возвращает строку "auto". У меня у блока высота в стилях не прописана, то есть она формируется его содержимым, а вычисленное значение данной высоты нужно получить для организации анимированного hide. Если он будет возвращать "auto", а не число, то в алгоритме получится NaN, что приведёт к тому, что анимация работать не будет. Посему вопрос моей проблемы таков: как получить вычисленное (фактическое значение) свойства в IE8, если оно формируется содержимым, а не задаётся вручную в стилях? Вот пример кода:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
<script>
window.onload = function () {
var elem = document.getElementById("parent");
document.getElementById("output").innerHTML = getStyle(elem).height;
};
function getStyle(elem) {
var style = window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle;
return style;
}
</script>
<style>
#parent {
border: 1px solid gray;
background-color: #f6f6f6;
border-radius: 5px;
width: 80%;
/*height НЕ ЗАДАНА, А ФОРМИРУЕТСЯ СОДЕРЖИМЫМ*/
}
</style>
</head>
<body>
<p id="output">тут будет высота блока</p>
<div id="parent">
<div style="height: 100px; width: 100px;">fgdfgdfg</div>
<div style="height: 100px; width: 100px;">fgdfgfdg</div>
</div>
</body>
</html>
Здесь парсится в параграф не значение вычисленной высоты, как это делают IE9 и прочие браузеры, поддерживающие getComputerStyle, а строку "auto". Надеюсь, что нормально объяснил суть своей проблемы. |
Для получение текущей высоты следует использовать offsetHeight.
У такого элемента нет никакой css высоты, потому auto - это верное значение. currentStyle служит для получения актуального css для элемента, а не вычислений. getComputedStyle просто идёт на поводу у говнокодеров(что видно из названия), как обычно. |
Aetae,
спасибо. именно это и нужно было. |
| Часовой пояс GMT +3, время: 08:24. |