[SOLVED] Closing Div Popup Window

[Monie]

I have div floating in my page. It will be there if you have an unread message in your PM inbox.

What I want to do is to put a CLOSE button to it so that I could close the irritation popup from blocking up my content area.

The code (from my tag team mate, Rakuli)

Code: Select all

<script type="text/javascript">
        // Place this just below the </body> tag
        if (showPMpopup)
        {
            document.write('<div style="width:300px;height:140px;padding:2px;border:solid 1px #000000;background-color:#FFF;position:absolute;top:-155px;left:200px;font:small verdana;font-size:12px;text-align:center;color:#000" id="PMpopup"><h1 style="margin:0;padding:3px;background:#365c2b;border:solid 1px #000000;font:small verdana;font-size:14px;text-align:center;color:#FFF">New Private Message!</h1><br />Hai <%=pmDisplay("username")%>!<br />You have <%Response.Write(totalPM)%> new Private Message<br /><br />Read Your Message<br /><a href="my-pm-inbox.asp">Go to your Inbox</a></div>');

        // now to animate the popup
        // set some variables

        function animatedPopup(varName)
        {
           ......
           ......
         }

        // Now the actual variable is set
        var PMAnimator = new animatedPopup('PMAnimator');
        // run the function after a second
        setTimeout('PMAnimator.animatePopup()', 1000);
        }
    </script>

[Rakuli]

Hi monie,

always looking to add features to old code

change the document.write line

Code: Select all

document.write('<div style="width:300px;height:140px;padding:2px;border:solid 1px #000000;background-color:#FFF;position:absolute;top:-155px;left:200px;font:small verdana;font-size:12px;text-align:center;color:#000" id="PMpopup"><span style="float: right" onclick="this.parentNode.style.display=\'none\';">Close (X)</span><h1 style="margin:0;padding:3px;background:#365c2b;border:solid 1px #000000;font:small verdana;font-size:14px;text-align:center;color:#FFF">New Private Message!</h1><br />Hai <%=pmDisplay("username")%>!<br />You have <%Response.Write(totalPM)%> new Private Message<br /><br />Read Your Message<br /><a href="my-pm-inbox.asp">Go to your Inbox</a></div>');
    </script>

[Monie]

Thanks Rakuli!
Can I change the mouse pointer to a pointing hand from the document.write line as well?

I tried changing the <span> to <a href> but having trouble with the positioning..

[Rakuli]

just add style="cursor:pointer" to the span tag

[Monie]

You are great Rakuli! Great to have you as our leader
Thanks again mate..