SawYouCry.net » Tutorial / Php / Resized Pop Up

Resized Pop-Up

A lot of visitors have been asking me how do I do the resized pop-up windows, like the one in my artwork, textures…etc sections. So here it goes…

- Firstly, you will need to copy the codes below;


<?php
$size = getimagesize("$imgurl");
$str_HEIGHT = ($size[1]+0);
$str_WIDTH = ($size[0]+0);
?>

<html>
<head>
<title> insert title bar message here </title>

<script type="text/javascript">
function resize() {
window.resizeTo(<?php echo $str_WIDTH;?>,<?php echo $str_HEIGHT;?>);
}
</script>

</head>
<body style="margin: 0px;" onload="resize();">

<img src="<?php echo $imgurl;?>" alt="" title="image title">

</body></html>

- Then, paste those codes in a blank notepad. Save it as pop.php. You may alter the title bar texts as you want.

- Secondly, copy the following codes, and paste them inside the <head> section of your pages;


<?php
$width=400;
$height=400;
?>

<script type="text/javascript">
function popUp(strTARGET, strWIDTH, strHEIGHT) {
var strOptions="";
var strOptions="width="+strWIDTH+",height="+strHEIGHT+"";
popwin=window.open(strTARGET,"",strOptions);
}
</script>

- Last step, to start using the function, you will need to use the following lines of codes;


<a href="pop.php" onclick="popUp ('pop.php?imgurl=IMAGE-URL-HERE', <?php echo $width;?>, <?php echo $height;?>); return false;">Pop It!</a>

- On the above codes, you will only need to change the IMAGE-URL-HERE bits. That’s all ;)

c0mment?

Comment? »