offsetTop
Получает вычисленную верхнюю позицию объекта относительно макета или родительских координат, указанных свойством offsetParent.
смещение влево
Получает рассчитанное левое положение объекта относительно макета или родительских координат, указанных свойством offsetParent.
смещениеВысота
Получает высоту объекта относительно макета или родительской координаты, указанной свойством offsetParent.
IE и Opera считают, что offsetHeight = clientHeight + полоса прокрутки + граница.
NS и FF считают offsetHeight фактической высотой содержимого веб-страницы, которая может быть меньше clientHeight.
смещениеWidth
Получает ширину объекта относительно макета или родительской координаты, указанной свойством offsetParent.
offsetParent
Получает ссылку на объект-контейнер, определяющий свойства offsetTop и offsetLeft объекта.
высота клиента
Получает высоту объекта без учета полей, границ, полос прокрутки или отступов, которые могут быть применены к объекту.
Никто не возражает против clientHeight. Все думают, что это высота видимой области контента, что означает высоту области, где контент можно увидеть в браузере страниц. последняя панель инструментов и над строкой состояния. Это не имеет никакого отношения к содержимому страницы.
clientLeft
Получает расстояние между свойством offsetLeft и фактической левой частью клиентской области.
clientTop
Получает расстояние между свойством offsetTop и фактической верхней частью клиентской области.
ширина клиента
Получает ширину объекта без учета полей, границ, полос прокрутки или отступов, которые могут быть применены к объекту.
Атрибут ПРОКРУТКА
прокрутка
Устанавливает или получает значение, отключена ли прокрутка.
прокруткаВысота
Получите высоту прокрутки объекта.
прокрутка влево
Задает или получает расстояние между левым краем объекта и самым левым краем видимого в данный момент содержимого в окне.
прокрутка вверху
Задает или получает расстояние между верхней частью объекта и верхней частью видимого содержимого в окне.
ширина прокрутки
Получает ширину прокрутки объекта. атрибут события
х
Устанавливает или получает координату x-пикселя положения указателя мыши относительно родительского документа.
экранX
Устанавливает или получает координату x положения указателя мыши относительно экрана пользователя.
смещениеX
Устанавливает или получает координату X положения указателя мыши относительно объекта, вызвавшего событие.
клиентX
Устанавливает или получает координату X положения указателя мыши относительно клиентской области окна, где клиентская область не включает в себя собственные элементы управления окна и полосы прокрутки.
Здесь мы говорим об интерпретации clientHeight, offsetHeight и ScrollHeight элемента document.body четырьмя браузерами. Здесь мы говорим о document.body. Если это HTML-элемент управления, то все по-другому.
Этими четырьмя браузерами являются IE (Internet Explorer), NS (Netscape), Opera и FF (FireFox).
высота клиента
Никто не возражает против clientHeight. Все думают, что это высота видимой области контента, что означает высоту области, где контент можно увидеть в браузере страниц. последняя панель инструментов и над строкой состояния. Это не имеет никакого отношения к содержимому страницы.
смещениеВысота
IE и Opera считают, что offsetHeight = clientHeight + полоса прокрутки + граница. NS и FF считают offsetHeight фактической высотой содержимого веб-страницы, которая может быть меньше clientHeight.
прокруткаВысота
IE и Opera считают, что ScrollHeight — это фактическая высота содержимого веб-страницы, которая может быть меньше, чем clientHeight. NS и FF считают, что ScrollHeight — это высота содержимого веб-страницы, но минимальное значение — clientHeight. Проще говоря
clientHeight — высота области, в которой контент просматривается через браузер.
NS и FF полагают, что offsetHeight и ScrollHeight являются высотами веб-контента, но когда высота веб-контента меньше или равна clientHeight, значение ScrollHeight равно clientHeight, а offsetHeight может быть меньше clientHeight.
IE и Opera считают offsetHeight видимой областью полосы прокрутки clientHeight плюс граница. ScrollHeight — это фактическая высота содержимого веб-страницы.
Та же причина
Объяснения clientWidth, offsetWidth и ScrollWidth такие же, как и выше, просто замените высоту на ширину.
но
FF интерпретирует clientHeight по-разному в разных DOCTYPE, но xhtml 1 trasitional не интерпретирует его, как указано выше. В других браузерах такой проблемы нет.
js получает высоту страницы
Скопируйте код кода следующим образом:
<скрипт>
функция getInfo()
{
варс = "";
s += "Ширина видимой области веб-страницы:"+ document.body.clientWidth;
s += "Высота видимой области веб-страницы:"+ document.body.clientHeight;
s += "Ширина видимой области веб-страницы: "+ document.body.offsetWidth + " (включая ширину краев и полос прокрутки)";
s += "Высота видимой области веб-страницы: "+ document.body.offsetHeight + " (включая ширину боковых линий)";
s += "Полная ширина текста веб-страницы:"+ document.body.scrollWidth;
s += "Полная высота текста веб-страницы:"+ document.body.scrollHeight;
s += "Высота прокрутки веб-страницы (ff):"+ document.body.scrollTop;
s += "Высота, до которой прокручивается веб-страница (т.е.):"+ document.documentElement.scrollTop;
s += "Прокручивается левая часть веб-страницы:"+ document.body.scrollLeft;
s += "В основной части веб-страницы: "+ window.screenTop;
s += "Текстовая часть веб-страницы слева:"+ window.screenLeft;
s += "Высота разрешения экрана:"+ window.screen.height;
s += "Ширина разрешения экрана:"+ window.screen.width;
s += "Высота доступной рабочей области экрана:"+ window.screen.availHeight;
s += "Ширина доступной рабочей области экрана:"+ window.screen.availWidth;
s += "Ваша настройка экрана: "+ window.screen.colorDepth +" битовый цвет";
s += «Настройки вашего экрана» + window.screen.deviceXDPI + «Пикселей/дюйм»;
//оповещение (я);
}
ПолучитьИнформацию();
</скрипт>
В моем локальном тесте:
Может использоваться под IE, FireFox, Opera.
document.body.clientWidth
document.body.clientHeight
Это доступно, это просто, это удобно.
А среди проектов компании:
Опера до сих пор использует
document.body.clientWidth
document.body.clientHeight
Но IE и FireFox используют
document.documentElement.clientWidth
document.documentElement.clientHeight
Оказывается, стандарты W3C создают проблемы.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Если вы добавите эту строку тегов на страницу
В ИЕ:
document.body.clientWidth ==> Ширина объекта BODY
document.body.clientHeight ==> высота объекта BODY
document.documentElement.clientWidth ==> Ширина видимой области
document.documentElement.clientHeight ==> Высота видимой области
В ФаерФоксе:
document.body.clientWidth ==> Ширина объекта BODY
document.body.clientHeight ==> высота объекта BODY
document.documentElement.clientWidth ==> Ширина видимой области
document.documentElement.clientHeight ==> Высота видимой области
В Опере:
document.body.clientWidth ==> Ширина видимой области
document.body.clientHeight ==> Высота видимой области
document.documentElement.clientWidth ==> Ширина объекта страницы (то есть ширина объекта BODY плюс ширина поля)
document.documentElement.clientHeight ==> Высота объекта страницы (то есть высота объекта BODY плюс высота поля)
А если стандарт W3C не определен, то
ИЕ это:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
ФаерФокс – это:
document.documentElement.clientWidth ==> Ширина объекта страницы (то есть ширина объекта BODY плюс ширина поля) document.documentElement.clientHeight ==> Высота объекта страницы (то есть высота объекта BODY плюс высота поля)
Опера это:
document.documentElement.clientWidth ==> Ширина объекта страницы (то есть ширина объекта BODY плюс ширина поля) document.documentElement.clientHeight ==> Высота объекта страницы (то есть высота объекта BODY плюс высота поля)
Это действительно хлопотная вещь. На самом деле, с точки зрения разработки, было бы гораздо удобнее иметь меньше объектов и методов и не использовать новейшие стандарты.