Ширина видимой области веб -страницы: document.body.clientwidth
Высокая высота видимой области веб -страницы: document.body.clientheight
Ширина видимой области веб -страницы: document.body.offsetwidth (включая ширину линии края)
Высота видимой области веб -страницы: document.body.offsetheight (включая ширину линии края)
Полная ширина текста веб -страницы: document.body.scrollwidth
Полный текст веб -страницы: document.body.scrollheight
Веб -страница развернута на высоком уровне: document.body.scrolltop
Левая от веб -страницы развертывается: document.body.scrollleft
В основной части веб -страницы: window.creentop
Слева от основного текста веб -страницы: window.screenleft
Высокое разрешение экрана: window.screen.height
Ширина разрешения экрана: window.screen.width
Доступная экрана высота рабочего пространства: window.screen.availeheight
Экран доступная ширина рабочей области: window.screen.availWidth
HTML точное позиционирование: Scrollleft, Scrollwidth, клиент -ширина, OffsetWidth
Scrollheight: Получает высоту прокрутки объекта.
Scrollleft: установите или получите расстояние между левой границей объекта и самым левым концом видимого в настоящее время в окне
Scrolltop: установите или получите расстояние между верхней частью объекта и верхней частью видимого содержания в окне
Прокрутка: Получите ширину прокрутки объекта
OffSetheight: Получает высоту объекта по сравнению с макетом или родительской координатой, указанной родительской координатой.
OffSetSetleft: Получает рассчитанное левое положение объекта относительно макета или родительских координат, указанных в свойстве OffSetSet.
OffSetTotop: Получает рассчитанную верхнюю позицию объекта относительно макета или родительской координаты, указанной в свойстве OffSetTop
event.clientx Горизонтальные координаты по сравнению с документом
Event.clienty вертикальные координаты относительно документа
event.offsetx Горизонтальные координаты по сравнению с контейнером
Event.Offsety Вертикальные координаты относительно контейнера
document.documentelement.scrolltop значения прокрутки вертикально
event.clientx + document.documentelement.scrolltop относительно горизонтальной координаты документа + количество прокрутки в вертикальном направлении
Т.е. различия Firefox следующие :
IE6.0, FF1.06+:
ClientWidth = ширина + прокладка
ClientHeight = высота + прокладка
OffsetWidth = ширина + накладка + граница
OffSetheight = высота + накладка + граница
IE5.0/5.5 :
ClientWidth = ширина - граница
ClientHeight = высота - граница
OffsetWidth = ширина
OffSetheight = высота
(Следует упомянуть, что атрибут маржи в CSS не имеет ничего общего с клиентской -точкой, OffsetWidth, ClientHeight и OffSetheight)
－－－－－－－－－－－－－－－－－－－
Технические основные моменты
Код в этом разделе в основном использует некоторые свойства объекта документа о окне. Основные функции и использование этих свойств следующие.
Чтобы получить размер окна, для разных браузеров необходимо использовать различные свойства и методы: чтобы обнаружить истинный размер окна, вам необходимо использовать атрибуты окна под Netscape; обнаружить тело в т.е.; Чтобы получить размер окна, вам нужно обратить внимание на размер корневого элемента, а не на элемент.
Свойство внутренней пропуска у окна содержит внутреннюю ширину текущего окна. Свойство Innerheight у окна содержит внутреннюю высоту текущего окна.
Атрибут тела объекта документа соответствует тегу HTML -документа. Свойство документов объекта документа представляет корневой узел HTML документа.
document.body.clientHeight представляет текущую высоту окна, где находится документ HTML. document.body.clientWidth представляет текущую ширину окна, где находится документ HTML.
Небольшое исследование о получении видимых окон в различных браузерах.
В моем местном тесте: его можно использовать в соответствии с IE, Firefox и Opera
Document.body.clientWidth
Document.Body.ClientHeight можно получить, он очень просто и удобен.
В проекте компании: Opera все еще используется
Document.body.clientWidth
document.body.clientheight
Но т.е. и Firefox используют
document.documentelement.clientWidth
document.documentelement.clientHeight
Оказывается, что стандарт W3C вызывает неприятности http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd ">
Если вы добавите эту строку на страницу
IE: Document.Body.ClientWidth ==> Ширина объекта тела
document.body.clientHeight ==> Высота объекта тела
document.documentelement.clientWidth ==> Видимая ширина площади
document.documentelement.clientHeight ==> Высота видимой области
В Firefox: Document.Body.ClientWidth ==> Ширина объекта тела
document.body.clientHeight ==> Высота объекта тела
document.documentelement.clientWidth ==> Видимая ширина площади
document.documentelement.clientHeight ==> Высота видимой области?
В Opera: Document.Body.ClientWidth ==>
document.body.clientheight ==> Повышенная высота площади
document.documentelement.clientWidth ==> Ширина объекта страницы (т.е. ширина объекта тела плюс ширина поля) Document.DocumentElement.ClientHeight ==> Высота объекта страницы (то есть высота объекта тела плюс высота поля)
Если нет стандарта для W3C,
Тогда т.е. есть: document.documentelement.clientwidth ==> 0
document.documentelement.clientHeight ==> 0
Firefox IS: Document.DocumentElement.ClientWidth ==> Ширина объекта страницы (то есть ширина объекта тела плюс ширина края)
document.documentelement.clientHeight ==> Высота объекта страницы (то есть высота объекта тела плюс высота поля)
Opera: Document.documentelement.clientWidth ==> Ширина объекта страницы (то есть ширина объекта тела плюс ширина края)
document.documentelement.clientHeight ==> Высота объекта страницы (то есть высота объекта тела плюс высота поля)
Это действительно хлопотно. Фактически, с точки зрения дизайна и разработки фронта, лучше иметь меньше объектов и методов, чем не использовать последние стандарты. Но если вы не можете идти в ногу с этой тенденцией, вы никогда не будете старшим дизайнером, поэтому мы все равно должны понимать и освоить эти знания.