Страница Жерар Т. - свойства окна, методы, события

Изменение расположения, размера и внешнего вида окна в Opera 7
Изменить размер и/или переместить окно

Для использования данного раздела необходимо включить опцию в меню
Tools/Настройки...Ctrl+F12/Advanced tab/Content category/Javascript Options.../Allow resizing and moving of windows
окна и изменять их размеры.





должна быть больше чем 300

должна быть больше чем 300



Линии координат

Вы можете перетаскивать, перемещать и изменять размеры 2-х главных блоков.

My most appreciative thanks goes to Alexander L. Slovesnik a.k.a. Unghost of Mozilla.ru for giving his time and volunteering his efforts to translate this page.

Эта страница работает только под браузерами Opera 7 (или выше). Минимальные системные требования: Pentium 2 400 с 128 Мб ОЗУ. Работа с данной страницей приводит к значительному расходу процессорного времени и оперативной памяти.

Opera 11.0 or higher

Данные экрана и окнаЩелкните здесь,чтобы прикрепить данный элемент к области просмотра

Разрешение экрана по горизонтали в пикселях screen.width -

Разрешение экрана по вертикали в пикселях screen.height -

Ширина экрана пользователя доступная для приложений screen.availWidth -

Высота экрана пользователя доступная для приложений (без панели задач) screen.availHeight -

Ширина области просмотра браузера
document.documentElement.offsetWidth
window.innerWidth -Данное значение изменяется динамически в реальном времени при изменении размера окна браузера пользователя. Это значение включает в себя полосу прокрутки по вертикали (если она имеется), но не включает в себя Explorer Bar или боковую панель. Примечание

Высота области просмотра браузера
document.documentElement.offsetHeight
window.innerHeight -Данное значение изменяется динамически в реальном времени при изменении размера окна браузера пользователя. Это значение включает в себя полосу прокрутки по горизонтали (если она имеется), но не включает в себя панель "Совет дня". Примечание

Доступная ширина окна браузера пользователя window.outerWidth -

Доступная высота окна браузера пользователя window.outerHeight -

Ширина видимой части документа в пределах данной определенной высоты области просмотра браузера document.documentElement.scrollWidth -

Высота видимой части документа в пределах данной определенной ширины области просмотра браузера document.documentElement.scrollHeight -

Расстояние по горизонтали от левого края окна браузера пользователя до левого края экрана window.screenLeft window.screenX -
Данное значение меняется при изменении размера (пока ещё не перемещении) окна браузера; значение может быть отрицательным. MSIE 5+ рассчитывает расстояние от левой края области данных (области клиента, видимой части документа) до левого края экрана. Примечание

Расстояние по вертикали от верхнего края окна браузера пользователя до верхнего края экрана window.screenTop window.screenY -
Данное значение меняется при изменении размера (пока ещё не перемещении) окна браузера; значение может отрицательным. MSIE 5+ рассчитывает расстояние от верхнего края области данных (области клиента, видимой части документа) до верхнего края экрана. Примечание

Расстояние/сдвиг по горизонтали данного <div> от левой стороны его абсолютно позиционированного ближайшего родительского блока или от левой стороны раскладки: здесь это документ ScreenData.offsetLeft -

Расстояние/сдвиг по вертикали данного <div> от верхней стороны его абсолютно позиционированного ближайшего родительского блока или от верхней стороны раскладки: здесь это документ ScreenData.offsetTop -

Координаты курсора мыши Щелкните здесь,чтобы прикрепить данный элемент к области просмотра
Координаты курсора мыши по оси X в пределах области данных браузера (области клиента, видимой части документа)
Opera 7 Internet Explorer 6 Netscape 6.x ev[en]t.clientX
Координаты курсора мыши по оси Y в пределах области данных браузера (области клиента, видимой части документа)
Opera 7 Internet Explorer 6 Netscape 6.x ev[en]t.clientY
X mouse coordinate within the target element
Internet Explorer 6 event.offsetX Note
Элемент под курсором в данный момент
Текущее событие
Y mouse coordinate within the target element
Internet Explorer 6 event.offsetY Note
X mouse coordinate within a relatively positioned element otherwise within its closest relatively positioned containing element
Opera 7 Internet Explorer 6event.x Note
Y mouse coordinate within a relatively positioned element otherwise within its closest relatively positioned containing element
Internet Explorer 6event.y Note
Координаты курсора мыши по оси X в пределах экрана пользователя
Opera 7 Internet Explorer 6 Netscape 6.x ev[en]t.screenX
Координаты курсора мыши по оси Y в пределах экрана пользователя
Opera 7 Internet Explorer 6 Netscape 6.x ev[en]t.screenY
Координаты курсора мыши по оси X в пределах всей ширины документа
Opera 7 Netscape 6.x evt.pageX
Координаты курсора мыши по оси Y в пределах всей ширины документа
Opera 7 Netscape 6.x evt.pageY
Расстояние в пикселях между левым краем документа и левой верхней частью видимой в области данных браузера (области клиента, видимой части документа)
Internet Explorer 6 document.documentElement.scrollLeft
Opera 7 Netscape 6.x window.pageXOffset
Расстояние в пикселях между верхним краем документа и самой верхней частью видимой в области данных браузера (области клиента, видимой части документа)
Internet Explorer 6 document.documentElement.scrollTop
Opera 7 Netscape 6.x window.pageYOffset

Notes about MSIE 6 and NS 6+

Expressions, terms used in reference sites

References used

Peter-Paul Koch's Properties and manipulation (via methods) of the Window object page
MasterGrid for MSIE 4 and 5 (operating systems Windows and MacIntosh), Netscape 4 and 6
http://www.quirksmode.org/viewport/compatibility.html

Web Developper Virtual Library's Grand Unified Table: events and supported properties of the event object
for Netscape 4 and MSIE 4 and 5
http://www.wdvl.com/Authoring/JavaScript/Events/table4.html

MSDN's interactive demo on measurement, dimension and location (in compatible mode only; not in standard-compliant mode)
http://msdn.microsoft.com/workshop/samples/author/css/overview/interactivemeasurement.htm

MSDN's interactive demo on measurement, object's event, scroll positions, client area (in compatible mode only; not in standard-compliant mode)
http://msdn.microsoft.com/workshop/samples/author/dhtml/overview/measure.htm

MSDN's reference on object measurement and location, scroll position, DHTML positioning properties (in compatible mode only; not in standard-compliant mode)
http://msdn2.microsoft.com/en-us/library/ms533024.aspx

Major incompatibilities between MSIE 5+ and Netscape 6+

There is a major incompatibility between MSIE 5+ window.screenTop and NS 6+ window.screenY. MSIE 5+ calculates the distance from the top of the content area (client area) to the top side of the screen. NS 6+ calculates the distance from the top of the browser's window to the top side of the screen. There seems to be no way to figure out the height of chrome elements (menu bar, tools bar, address bar, links bar) present in the browser for MSIE 5+.

The same phenomenon is observed for MSIE 5+ window.screenLeft and NS 6+ window.screenX. MSIE 5+ calculates the distance from the left of the content area (client area) to the left side of the screen. NS 6+ calculates the distance from the left of the browser's window to the left side of the screen. When the MSIE 5+ Explorer Bar is displayed, we can clearly see that the window.screenLeft value is increased while when the NS 6+ Sidebar is displayed, the window.screenX value does not increase since the referenced coordinates system is different. The same phenomenon is observed for chrome bars at the top of the browser's application.

NS 6+ evt.layerX/Y properties calculate the distance from the left/top corner of an element if it is absolutely or relatively positioned; if it's not positioned, then the values are the distance from the left/top of its closest absolutely or relatively positioned containing element. In case the target element has no positioned element within the containment hierarchy, then the body element is the positioned containing element.
There appears to be 3 exceptions to this: input type="text", textarea and options in a select. When an event occurs in one of these 3 elements, regardless if they are positioned or not, the evt.layerX/Y properties will return the offset coordinates within them.
Here's an interactive demo on evt.layerX/Y property values.

MSIE 5+ event.offsetX/Y properties calculate the distance from the left/top corner of the target element (e.g. clicking inside an image) regardless if the element is absolutely or relatively positioned or if its containment element is positioned or not. There appears to be 4 exceptions to this: for A, H, P and SPAN elements, the event.offsetX/Y will return coordinates relative to the offsetParent (which is usually - not always - the closest positioned containing element), otherwise to the BODY element.

So NS 6+ evt.layerX/Y properties are not the equivalent of MSIE 5+ event.offsetX/Y properties.

Known bugs and expected fixes for Mozilla

Bugzilla Bug #114649; Target: Future
Onresize events should fire while resizing the window, not just when the mouse stops moving.

Valid HTML 4.01! CSS compliant Web standards project Загрузка Nvu на русский на русский

© Gérard Talbot  |   Site map