DHTML Lab - dhtmlab.com - DHTML Diner - NS4: Ensuring DHTML Layout on Resize | 2 | WebReference

DHTML Lab - dhtmlab.com - DHTML Diner - NS4: Ensuring DHTML Layout on Resize | 2

DHTML Diner Logo

This is a Netscape Navigator 4 technique. The in-page examples will only work in Navigator 4 versions with the bug (ex. v4.04).

Click the button above to close demonstration window.

Ensuring DHTML Layout on Resize (2)

The bug will be demonstrated in a new window, to avoid constant reloading of the present page. What applies to this demonstration window, applies to the primary browser window as well. The demonstration window cannot lose focus, so use the Close button in the left column to close it, when you are finished.

An alert window will appear whenever the resize event fires in the demonstration window. The demonstration window retains its focus, so you cannot minimize it, or hide it behind other windows. This is for purposes of this column, and is no way related to our discussion. When you have finished, simply close it with the button in the left column.

Remember, the example work for you only if the browser you are using has the bug.

Example 1: Long Page; No Scrollbars; Not Resizable.


Click button to view example.
Click again to repeat example		The page in the demonstration window is a long page that would require scrollbars for full viewing. The window has scrollbars turned off, and is not resizable. No alert window appears when you load the page. In fact, the behavior is normal, since there are no scrollbars.

No scrollbars: no bug.

Example 2: Long Page; Scrollbars; Not Resizable.


Click button to view example.
Click again to repeat example		The same page, with scrollbars visible, fires a resize event when the scrollbars appear, even though no user-intervention has occured. The window has certainly not been resized since the window is not resizable!

Scrollbars: bug!

Example 3: Long Page; No Scrollbars; Resizable.


Click button to view example.
Click again to repeat example		This time we've turned off the scrollbars, but the window is resizable, as any normal browser window would be. Resize the window. The resize event fires, as expected, upon a bona fide resize.

No scrollbars: no bug.

Example 4: Long Page; Scrollbars; Resizable.


Click button to view example.
Click again to repeat example		Now the fun starts. Our window now has scrollbars and is resizable. When the page loads, and the scrollbars appear, the resize event fires erroneously. Resize the window. What happens? The resize event is fired twice! Once normally, and once for the scrollbars!

Example 5: Short Page; Scrollbars; Resizable.


Click button to view example.
Click again to repeat example		In our final example, we have a very short page that does not warrant scrollbars, even though scrollbars are enabled. Resize the window slightly. The true resize event fires. Resize the window to a small size to force scrollbars to appear. Now the resize fires twice! The bug kicks in whenever scrollbars are present.

Luckily, the bug can easily be avoided.



Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: May 07, 1998
Revised: Oct 07, 1998

URL: https://www.webreference.com/dhtml/diner/resize/resize2.html