Pro HTML5 and CSS3 Design Patterns

(avery) #1

CHAPTER 20 ■ ALERTS


Pop-Up Alert


HTML Header


<head>
<!-- only script elements are shown -->

<script language="javascript" type="text/javascript" src="yahoo.js"></script>
<script language="javascript" type="text/javascript" src="event.js"></script>
<script language="javascript" type="text/javascript" src="chdp.js"></script>
<script language="javascript" type="text/javascript" src="cssQuery-p.js"></script>
<script language="javascript" type="text/javascript" src="page.js"></script>
</head>

page.js


function initPage() {
assignEvent( 'click', '*.popup-trigger',
applyToDescendants, '*.popup', toggleVisibility );

assignEvent( 'mouseover', '*.popup-trigger',
applyToDescendants, '*.popup', showElement );

assignEvent( 'mouseout', '*.popup-trigger',
applyToDescendants, '*.popup', hideElement );
}

addEvent(window, 'unload', purgeAllEvents);
addEvent(window, 'load', initPage);

//The functions addEvent() and assignEvents() are in chdp.js.
//Full documentation for each function is found in the source code.
Free download pdf