Hi,
I came across this and i was wondering if there was a way to add a close button or text to the top right of the popup box.
I can click outside the box and the popup closes but not in the box itself.
If anybody knows i would be most grateful

You can probably tell im not a programmer lol

The HTML
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="custom.js"></script>
</head>
<body>
<div id="trigger">
<h1><a href="#" rel="popuprel" class="popup">Click Here for popup Window</a></h1>
</div>

<div class="popupbox" id="popuprel">
<div id="intabdiv">
<h2>Content Demo 1</h2>
<p>First Window</p>
</div>
</div>
<div id="fade"></div>
</body>
</html>
The CSS
#trigger {
text-align:center;
}
.popupbox {
width:500px;
height:300px;
background-color:#fff;
display: none; /* Hidden as default */
float: left;
position: fixed;
top: 50%; left: 50%;
z-index: 99999;
}
#intabdiv {
padding:10px;
}
#intabdiv h2 {
font-size:16px;
color:#696868;
font-family:Verdana, Geneva, sans-serif;
}
#intabdiv p {
font-size:12px;
color:#696868;
font-family:Verdana, Geneva, sans-serif;
line-height:20px;
}
#fade {
display: none; /* Hidden as default */
background: #000;
position: fixed; left: 0; top: 0;
width: 100%; height: 100%;
opacity: .80;
z-index: 9999;
}
Javascript
$(document).ready(function() {
$('a.popup').click(function() {
var popupid = $(this).attr('rel');
$('#' + popupid).fadeIn();
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
var popuptopmargin = ($('#' + popupid).height() + 10) / 2;
var popupleftmargin = ($('#' + popupid).width() + 10) / 2;
$('#' + popupid).css({
'margin-top' : -popuptopmargin,
'margin-left' : -popupleftmargin
});
});
$('#fade').click(function() {

$('#fade , #popuprel ').fadeOut()
return false;
});
});