Possible Duplicate:
Resizing an iframe based on content
I have an iframe where the src is an HTML file and this iframe is put inside usercontrol:
<iframe frameborder="0" src="CName.htm" align="left" width="730" height="1100" ></iframe>
I need the iframe to resize according to the content so that it's height is set according to the hieght of the HTML file and I don't need to use scrolling attribute. Do you have any idea?
What you can do is set specific width and height to your iframe (for example these could be equal to your window dimensions) and then applying a scale transformation to it. The scale value will be the ratio between your window width and the dimension you wanted to set to your iframe.
iFrames let you embed external content, such as YouTube videos, advertisements, and content from other sites into your own web page. You can easily resize iFrames using HTML and/or CSS, and even make them resizable so they'll adjust automatically based on the user's screen size.
given the iframe is directly under body. If the iframe has a parent between itself and the body, the iframe will still get the height of its parent. One must explicitly set the height of every parent to 100% as well (if that's what one wants).
I've used the following jQuery code to do this:
$('#iframe_id').load(function () {
$(this).height($(this).contents().height());
$(this).width($(this).contents().width());
});
I don't think this will work if the iframe contents are cross-domain, though.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With