Chrome, Safari и размер view-порта с абсолютно позиционируемыми элементами
 

Пытаюсь найти кроссбраузерное решение, позвояющее определить размеры view-порта.
Определил, что нужный результат дают значения
var Width=document.documentElement.scrollWidth;
var Height=document.documentElement.scrollHeight;

Этот способ всегда даёт корректный результат.

Но этот способ даёт сбой в браузерах GoogleChrome и Safari, когда на странице есть элементы со свойством position:absolute; Если задать для элемента свойство position:absolute; и с помощью top и left расположить элемент далеко влево или вправо (например, задав большие значения top=3000 и left=2000), то в этих браузерах view-порт не увеличивается. В других же браузерах, таких как IE, Firefox, Opera view-порт увеличится таким образом, что будет содержать в себе этот элемент.

Помогите найти кроссбраузерное решение, учитывающее этот случай. В разметке может возникнуть ситуация, когда элементы имеют позиционирование position:absolute;, а тогда в браузерах GoogleChrome и Safari мы получим совсем не тот размер view-порта.

Для примера я привожу html-код, с помощью которого я тестирую различные значения.

Здесь элементы #the_image2 и #the_image3 абсолютно спозиционированы и визуально находятся вне тега body. В браузерах GoogleChrome и Safari view-порт с помощью document.documentElement.scrollWidth; и document.documentElement.scrollHeight; определяется неправильно.
Нормальное зачение view-порта в остальных браузерах составляет 1355х1588.

А вы сейчас что view-портом называете? Причём тут scrollWidth/scrollHeight?

view-порт = вьюпорт из этой статьи:
http://javascript.ru/blog/Andrej-Par...enta-elementov

scrollWidth/scrollHeight - это просто условность, чтобы много не писать, а при появлении окна сразу можно было определить, какие переменные дают какие значения. Просто для теста нужно. Могу убрать из кода и ставить только
var cX1=document.documentElement.scrollWidth;
var cY1=document.documentElement.scrollHeight;

scroll* по логике должен дать размер документа, а не размер окна.

function getRootElement(doc) {
    doc = doc || document;
    return doc.compatMode == 'CSS1Compat' ? doc.documentElement : doc.body;
}

function getViewportSize(doc) {
    doc = doc || document;
    var elem = getRootElement(doc);
    return [elem.clientWidth, elem.clientHeight];
}

А можно в контексте моего скрипта этот пример привести?
Хотелось бы иметь cX5 и cY5 слева, а вычисления справа, чтобы точно знать, что это ширина, а это высота вьюпорта.

В контекст вашего скрипта мне влезать не хотелось бы. :)

Как из этих функций получить ширину и высоту вьюпорта? Что такое doc?

Вызвать их, очевидно.

document. Необязательный аргумент.

Спасибо за приведённый пример. Хотя он считает не размер документа со скроллом, а просто размер окна браузера, в котором отображается документ, но мне это тоже пригодиться.

Я нашёл решение для GoogleChrom и Safari. корректные ширина и высота документа определяются так:
var cX4=document.body.scrollWidth;
var cY4=document.body.scrollHeight;

Для остальных браузеров так:
var cX1=document.documentElement.scrollWidth;
var cY1=document.documentElement.scrollHeight;

viewport это и есть окно браузера.