<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a title="goodbye gorgeous" href="#"class="close"><img src="https://64.media.tumblr.com/tumblr_mdpf4xTtf61qdlkyg.gif"></a> </a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
paste this under <style type=text/ccs>:
display:none;
position:fixed;
left:0; top:0;
width:100%;
height:100%;
opacity:.80;
z-index:9999; }
.popup_block {
width: 300px;
height: 400px;
overflow-y:scroll;
overflow-x:hidden;
display:none;
background:#fff;
padding:14px;
border:14px solid {color:link};
float:left;
font-family: 'Patrick Hand', cursive;
font-size: 15px;
position:fixed;
top:50%; left:50%;
z-index:99999;
-webkit-box-shadow: 0px 0px 20px #000; -moz-box-shadow: 0px 0px 20px #000; box-shadow: 0px 0px 20px #000; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
img.btn_close {
float:right;
margin:3px 3px 0px 0px; }
*html #fade { position:absolute; }
*html .popup_block { position:absolute; }
paste this under </body>:
<div id="02" class="popup_block">
<center><br><br>
<div style="font-size:60px; text-align:center;">Title Here</div><br><br></center></div><br>
<center> content goes here!
</center></div>
</div></div></div></div></div></div></div></div></div></div>
this is the link for this popup:
#?w=500" rel="02" class="poplight
