I understand this script except for the notation in: “popup_elem.style.display == ‘block’ ? popup_elem.style.display = ‘none’ : popup_elem.style.display = ‘block’;” Can you explain it for me please?
Complete script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
/*<![CDATA[*//*---->*/
function popup(popup_name) {
popup_elem=document.getElementById(popup_name);
popup_elem.style.display == 'block' ? popup_elem.style.display = 'none' : popup_elem.style.display = 'block';
}
/*--*//*]]>*/
</script>
<style type="text/css">
#outer {position:fixed; top:0; left:0; width:100%; height:100%; display:none; background-color:#000; opacity: .75; }
.middle {height:100%; display:table; margin:0 auto;}
.inner {vertical-align:middle; display:table-cell;}
#firstPopupDiv {width:100px;height:100px;background-color:red;margin:40px 0px 0px 0px;}
</style>
<!--[if IE]>
<style>
#outer {filter: alpha(opacity = 75);}
</style>
<![endif]-->
<!--[if lte IE 7]>
<style>
/* centering for ie6/ie7 */
.middle { position:absolute; top:50%; left:50%; height:auto; z-index:999;}
.inner { position:relative; top:-50%; left:-50%; }
</style>
<![endif]-->
</head>
<body>
<h1 style="float:left;"><a href="javascript:void(0);" onclick="popup('outer')">Click Here To Open The Pop Up</a></h1>
<div id="outer" onclick="popup('outer')">
<div class="middle">
<div class="inner">
<div id="firstPopupDiv">
<p>You are here.</p>
</div>
</div>
</div>
</div>
</body>
</html>