javascript Div pop up

<style type="text/css">
    #popup
     {
        background-color:#111;
        opacity: 0.65;
        filter:alpha(opacity=65);
        position:absolute;
        z-index: 6001;
        top:0px;
        left:0px;
        width:100%;
     }
    #popUpDiv
     {
        position:absolute;
        background-color:#eeeeee;
        width:300px;
        height:300px;
        z-index: 6002;
    }   
</style>
<script type="text/javascript">
    function toggle(div_id)
      {
          var el = document.getElementById(div_id);
          if ( el.style.display == 'none' ) { el.style.display = 'block';}
          else {el.style.display = 'none';}
      }
    function popup_size(popUpDivVar)
       {
          if (typeof window.innerWidth != 'undefined')
           {
             viewportheight = window.innerHeight;
           }
          else
           {
             viewportheight = document.documentElement.clientHeight;
           }
          if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight))
           {
              popup_height = viewportheight;
           }
          else
           {
             if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight)
                {
                   popup_height = document.body.parentNode.clientHeight;
                }
             else
                {
                   popup_height = document.body.parentNode.scrollHeight;
                }
           }
          var popup = document.getElementById('popup');
          popup.style.height = popup_height + 'px';
          var popUpDiv = document.getElementById(popUpDivVar);
          popUpDiv_height=popup_height/2-200;
          popUpDiv.style.top = popUpDiv_height + 'px';
      }
    function window_pos(popUpDivVar)
      {
          if (typeof window.innerWidth != 'undefined')
            {
              viewportwidth = window.innerHeight;
            }
          else
            {
              viewportwidth = document.documentElement.clientHeight;
            }
          if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth))
            {
              window_width = viewportwidth;
            }
         else
            {
              if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth)
                 {
                   window_width = document.body.parentNode.clientWidth;
                 }
              else
                 {
                   window_width = document.body.parentNode.scrollWidth;
                 }
          }
          var popUpDiv = document.getElementById(popUpDivVar);
          window_width=window_width/2-150;
          popUpDiv.style.left = window_width + 'px';
      }
    function popup(windowname)
      {
          popup_size(windowname);
          window_pos(windowname);
          toggle('popup');
          toggle(windowname);          
      }
</script>
<div id="popup" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
    <a href="#" onclick="popup('popUpDiv')">Click here To Close</a>
</div>
<a href="#" onclick="popup('popUpDiv')">Click Here To Open The Pop Up</a>