PDA

View Full Version : resize iframe to loading image height/width



acctman
07-23-2007, 11:24 PM
I'm loading images directly into an iframe to embed on a page. is it possible to resize the iframe to the height/width of the loading jpg? the script i'm using is a flash image slider so its using the iframe name tag to output the image large image when clicked. I would love to be able to use a DIV tag but it doesn't have a name property that I can use.




<iframe name="imgdisplay" id="imgdisplay" style="float: middle" border="0" frameborder="0" scrolling="no" width="600px" height="515px">
</iframe>

jscheuer1
07-24-2007, 07:17 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#image_frame {
border-top:2px solid #666666;
border-right:2px solid #dddddd;
border-bottom:2px solid #dddddd;
border-left:2px solid #666666;
}
</style>
<script type="text/javascript">
function frame_image(im){
var wf='image_frame', fr=document.getElementById(wf), nim=new Image(),
doit=function(){window.frames[wf].location.replace(nim.src); fr.width=nim.width; fr.height=nim.height;};
nim.onload=doit;
nim.src=im;
}
onload=function(){window.frames['image_frame'].location.replace('about:blank');};
</script>
</head>
<body>
<iframe id="image_frame" name="image_frame" src="about:blank" width="300" height="300" scrolling="no" marginheight="0" marginwidth="0" frameborder="1"></iframe>
<br>
<a href="image1.jpg" onclick="frame_image(this.href);return false;">Test 1</a>
<br>
<a href="image2.jpg" onclick="frame_image(this.href);return false;">Test 2</a>
<br>
<a href="image3.jpg" onclick="frame_image(this.href);return false;">Test 3</a>

</body>
</html>

Added Later:

There is no style:

float:middle;