File Under: JavaScript

JavaScript Event – load

This code was written based on a template by John Resig. The original can be found at John Resig’s addEvent function website.

The code, and the template, are referred to in Webmonkey’s JavaScript Events reference page. In this example, the onLoad event fires when the page has completely finished loading, including all graphics and external files (CSS, JavaScript). The load event can also be attached to an image to determine when it has loaded.

The Code

<html>

<head>

<script>

// addEvent function by John Resig:

// http://ejohn.org/projects/flexible-javascript-events/

function addEvent( obj, type, fn ) {

  if ( obj.attachEvent ) {

    obj['e'+type+fn] = fn;

    obj[type+fn] = function(){obj['e'+type+fn]( window.event );}

    obj.attachEvent( 'on'+type, obj[type+fn] );

  } else

    obj.addEventListener( type, fn, false );

}

</script>

</head>

<body>



<!-- HTML for example event goes here -->



<script>

// Script for example event goes here

addEvent(window, 'load', function(event) {

	alert('The page has loaded');

});

</script>

</body>

</html>

What it Looks Like

See this example of the load event.