Pop Over Form Using Hidden DIV Version 2

<%
Option Explicit
Session.CodePage=65001
Response.Charset="UTF-8"


if LCase(Request.ServerVariables("HTTP_METHOD"))="post" then
    Dim first, last, middle, address, city, state, zipcode, email, homephone, workphone, posted
    posted=""
    first = getField("first,rXname")
    last = getField("last,rXname")
    middle = getField("middle,rXalpha")
    address = getField("address,rXsafe")
    city = getField("city,rXsafe")
    state = getField("state,rXsafe")
    zipcode = getField("zipcode,rXsafe")
    email = getField("email,rXsafe")
    homephone = getField("homephone,rXsafe")
    workphone = getField("workphone,rXsafe")
    posted = "First: " & first & "<br>"
    posted = posted & "Middle: " & middle & "<br>"
    posted = posted & "Last: " & last & "<br>"
    posted = posted & "Address: " & address & "<br>"
    posted = posted & "City: " & city & "<br>"
    posted = posted & "State: " & state & "<br>"
    posted = posted & "Zip COde: " & zipcode & "<br>"
    posted = posted & "E-Mail: " & email & "<br>"
    posted = posted & "Home Phone: " & homephone & "<br>"
    posted = posted & "Work Phone: " & workphone & "<br>"
end if
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="en-US">
<meta name="author" content="Roderick Divilbiss">
<meta name="copyright" content="© 2005-2010 Roderick Divilbiss">
<title>Pop Over Form</title>

<script type="text/javascript">
function showForm() {
    document.getElementById('glass').style.display='block';
    document.getElementById('glass').style.width=(document.documentElement.clientWidth+20)+'px';
    document.getElementById('glass').style.left='0px';
    document.getElementById('glass').style.height=(document.documentElement.clientHeight+20)+'px';
    document.getElementById('glass').style.top='0px';
    var scrollTop = 0;
    var left = 0;
    scrollTop = (document.documentElement.scrollTop) ? document.documentElement.scrollTop : window.pageYOffset;
    //For IE 8
    if (scrollTop==undefined) scrollTop = 0;
    left = (document.documentElement.clientWidth-433)/2;
    oDiv = document.getElementById('theFormDiv');
    oDiv.style.display='block';
    oDiv.style.top = (scrollTop-10)+'px';
    oDiv.style.left = (left)+'px';
    return false;
}

function hideForm() {
    oDiv = document.getElementById('theFormDiv');
    oDiv.style.display='none';
    document.getElementById('glass').style.display='none';
    return false;
}
</script>
<style type="text/css">
#theFormDiv {
    display:none;
    position:absolute;
    background-color:#EEE;
    border:1px solid #000;
    padding:1em;
    margin:3em;
    width:28em;
    z-index:9;
}

body {
    color: #000000;
    background: #FFFFFF;
    text-align: left;
    font-size: 0.9em;
    font-family: Arial, Helvetica, sans-serif;
}

#glass {
    position:absolute;
    display:none;
    top:0px;
    left:0px;
    height:100%;
    width:100%;
    z-index:2;
    background-color:#000000;
    opacity:80;
    filter: alpha(opacity=60);
    opacity:.60;
    -khtml-opacity:.60;
    -moz-opacity:.60;
}

form {
    width:24em;
}

form fieldset {
    float: left;
    width:22em;
    margin:0 0.3em 0.3em 0;
}

form legend {
    font-weight:bold;
color:blue;
}

form p {
    margin: 0;
}

form label {
    float:left;
    margin:0.5em;
}

form input {
    width:100%;
    font-size:100%;
}

/* thisForm.css */
#label-first, #label-last {
    width:8em;
}

#label-middle {
    width:2em;
}

#label-address, #label-email {
    clear:left;
    width:20em;
}

#label-city {
    clear:left;
    width:9em;
}

#label-state {
    width:2em;
}

#label-zipcode {
    width:7em;
}

#label-homephone {
    clear:left;
    width:9.5em;
}

#label-workphone {
    width:9.5em;
}

#bSubmit {
    float:left;
    margin:0.5em;
    clear:left;
    width:auto;
}

#bCancel {
    float:left;
    margin:0.5em;
    width:auto;
}

.field-hint {
    font-size:0.7em;
    color:#555555;
}

.nocss {
    display:none;
}
</style>
</head>

<body>
<div id="theExample">
<p><input type="button" name="btn" id="btn" value="Click To Open Form" onclick="return showForm();">&nbsp;<a href="http://www.rodsdot.com/asp/Pop-Over-Form.asp" alt="Original Version">Original Pop-Over Form</a></p>
<%
if posted<>"" then
    Response.Write "<p>"&posted&"</p>"
end if
%>
</div>
<div id="glass">&nbsp;</div>
<div id="theFormDiv">
<form method="post" id="frm" action="<%="http://" & Request.ServerVariables("SERVER_NAME") & Request.ServerVariables("SCRIPT_NAME")%>">
<fieldset>
  <legend>Name &amp; Address</legend>
  <p>
    <label id="label-first">First Name*
    <input name="first" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">John</span></label>
  </p>
  <p>
    <label id="label-middle">MI
    <input name="middle" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">Q</span></label>
  </p>
  <p>
    <label id="label-last">Last Name*
    <input name="last" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">Public</span></label>
  </p>
  <p>
    <label id="label-address">Address*
    <input name="address" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">1234 Any St, Apt#4</span></label>
  </p>
  <p>
    <label id="label-city">City*
    <input name="city" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">Hometown</span></label>
  </p>
  <p>
    <label id="label-state">ST*
    <input name="state" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">AL</span></label>
  </p>
  <p>
    <label id="label-zipcode">Zip Code*
    <input name="zipcode" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">99999-9999</span></label>
  </p>
</fieldset>
<fieldset>
  <legend>Contact Information</legend>
  <p>
    <label id="label-email">E-Mail Address*
    <input name="email" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">john.public@domain.com</span></label>
  </p>
  <p>
    <label id="label-homephone">Home Phone
    <input name="homephone" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">(999) 999-9999</span></label>
  </p>
  <p>
    <label id="label-workphone">Work Phone
    <input name="workphone" type="text">
    <span class="nocss">Efield-hinte entry: </span>
    <span class="field-hint">(999) 999-9999</span></label>
  </p>
  <p>
    <input type="submit" id="bSubmit" name="bSubmit" value="Submit">
    <input type="button" id="bCancel" name="bCancel" value="Cancel" onclick="hideForm();">
  </p>
</fieldset>

</form>
</div>
</body>

</html>
How can you pop a form page without being blocked by pop-up blockers?
