JavaScript Abstract Event Handlers
window.onresize
The “window.onresize” event handler performs the function of handling the “onresize” event for the “window” object by firing the “ezWindowOnReSizeCallback(width, height)” Call-Back if that Call-Back function has been implemented.
window.onscroll
The “window.onscroll” event handler performs the function of handling the “onscroll” event for the “window” object by firing the “ezWindowOnscrollCallback(scrollTop, scrollLeft)” Call-Back if that Call-Back function has been implemented. The floating debug menu, as it is called, is repositioned as the browser client window is scrolled along with the pop-up system message panel and the System Busy indicator panel. You can inhibit or enable the floating debug menu reposition action by setting the “bool_isDebugPanelRepositionable” variable as desired.
The const_div_floating_debug_menu variable
It should be noted that the programmer can use the “const_div_floating_debug_menu” JavaScript constant to control where the floating debug menu is positioned during the “ezWindowOnscrollCallback(scrollTop, scrollLeft)” Call-Back assuming the “bool_isDebugPanelRepositionable” JavaScript variable is set to “false”. Consider the following code sample:
var dObj = _$(const_div_floating_debug_menu);
if (!!dObj) {
dObj.style.position = const_absolute_style;
dObj.style.top = '100px';
dObj.style.left = '100px';
dObj.style.width = (ezClientWidth() - 175) + 'px';
} |
Notice how easy it is to place this code fragment into the body of the “ezWindowOnscrollCallback(scrollTop, scrollLeft)” Call-Back. Once the “ezWindowOnscrollCallback” fires the floating debug menu will float to a position you choose.
The typical way to control how the floating debug menu floats is to choose a position relative to the top and left of the current browser window and then reposition the floating menu every time the “ezWindowOnscrollCallback” fires.
|