Одна из самых сложных проблем в моем javascript-опыте была правильной (то есть "кросс-браузер" ) вычислением высоты . В моих приложениях у меня много динамически генерируемого iframe, и я хочу, чтобы все они выполняли авторезист в конце события загрузки, чтобы настроить их высоту и ширину.
В случае вычисления height мое лучшее решение заключается в следующем (с помощью jQuery):
function getDocumentHeight(doc) {
var mdoc = doc || document;
if (mdoc.compatMode=='CSS1Compat') {
return mdoc.body.offsetHeight;
}
else {
if ($.browser.msie)
return mdoc.body.scrollHeight;
else
return Math.max($(mdoc).height(), $(mdoc.body).height());
}
}
Я искал интернет без успеха. Я также протестировал библиотеку Yahoo, которая имеет некоторые методы для размеров документа и видового экрана, но это не удовлетворительно.
Мое решение работает прилично, но иногда оно вычисляет более высокую высоту.
Я изучил и испытал тонны свойств относительно высоты документа в Firefox/IE/Safari: documentElement.clientHeight, documentElement.offsetHeight, documentElement.scrollHeight, body.offsetHeight, body.scrollHeight, ...
Кроме того, jQuery не имеет согласованного поведения в разных браузерах с вызовами $(document.body).height(), $('html', doc).height(), $(window).height()
Я вызываю вышеуказанную функцию не только в конце события загрузки, но также и в случае динамически вставленных элементов DOM или элементов, скрытых или показанных. Это случай, который иногда нарушает код, который работает только в событии загрузки.
Есть ли у кого-то реальное решение для кросс-браузера (по крайней мере, Firefox/IE/Safari)? Некоторые подсказки или подсказки?