Page Events

There are special events that trigger from certain page-level actions on the browser window itself.

Event Handlers for Page Load and Unload Events
These event handlers are placed at attributes of the HTML body element.

    onload          (triggers the instant the page is fully rendered and done loading)
    onbeforeunload  (triggers just before the page unloads)
    onresize        (triggers when you drag the corner of the browser window to resize it)
    onscroll        (triggers when you scroll the browser window)

To understand this example, you will need to examine the source code and open the Console where this example logs entries when the events trigger.

Notice in the console how many times the onresize and onscroll events are triggered when you scroll the window or drag it by its corner.
For that reason, these events can be tricky to use in practice.

To trigger the onbeforeunload event, you will need to attempt to surf away from this page.
The following link will suffice for that. Reloading this page will also trigger the onbeforeunload event.

Click to go to Cubs.com and surf away from this example.
You may see some weird messages in the console if you actually go to the Cubs.com page.