Popup Source

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
            "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
    <title>Pop Up</title>
    <link rel=stylesheet type="text/css" href="../class.css">
    <script type="text/JavaScript">
        if (document.all) {
            docObj = "document.all."
            styleObj = ".style"
        }
        else {
            docObj = "document."
            styleObj = ""
        }
    
        function popUp(evt,currElem) {
            popUpWin = eval(docObj + currElem + styleObj)
            
            if (document.all) {
                popUpWin.top = parseInt(evt.y)+2
                popUpWin.left = parseInt(evt.x)-125
            }
            else {
                popUpWin.top = parseInt(evt.pageY)+2
                popUpWin.left = parseInt(evt.pageX)-125
            }
            if (popUpWin.left < 2)
                popUpWin.left = 2
            popUpWin.visibility = "visible"
        }
    </script>
    <style type="text/css">
        #popUp1 {position:absolute; visibility:hidden; z-index:10;}
        #popUp2 {position:absolute; visibility:hidden; z-index:10;}
        #popUp3 {position:absolute; visibility:hidden; z-index:10;}
        #popUp4 {position:absolute; visibility:hidden; z-index:10;}
        .popUpStyle {background-color:#FFFF99; width:100px; 
                     layer-background-color:#FFFF99; 
                     padding:5px; border:1px solid #CCCC00;
                     font:normal 18px/21px helvetica, sans-serif;}
    </style>
</head>
<body bgcolor=white>
<map name="alice25">
    <area shape=rect coords="57,147,250,298"
        href="javascript:void('')" alt="" 
        onmouseover="popUp(event,'popUp1');window.status='';
        return true" onmouseout=
        "eval(docObj + 'popUp1' + styleObj).visibility='hidden'">
    <area shape=rect coords="243,73,376,272"
        href="javascript:void('')" alt="" 
        onmouseover="popUp(event,'popUp2');window.status='';
        return true" onmouseout=
        "eval(docObj + 'popUp2' + styleObj).visibility='hidden'">
    <area shape=rect coords="375,182,439,268"
        href="javascript:void('')" alt="" 
        onmouseover="popUp(event,'popUp3');window.status='';
        return true" onmouseout=
        "eval(docObj + 'popUp3' + styleObj).visibility='hidden'">
    <area shape=rect coords="452,38,598,276"
        href="javascript:void('')" alt="" 
        onmouseover="popUp(event,'popUp4');window.status='';
        return true" onmouseout=
        "eval(docObj + 'popUp4' + styleObj).visibility='hidden'">
</map>
<span id="popUp1" class="popUpStyle">Alice</span>
<span id="popUp2" class="popUpStyle">March Hare</span>
<span id="popUp3" class="popUpStyle">Dormouse</span>
<span id="popUp4" class="popUpStyle">Mad Hatter</span>
<img src="images/alice25a.gif" alt="" width=640 height=487
    usemap="#alice25" border=0>
</body>
</html>