Member Avatar for os.kwesi

Hi,

How can I automatically resize the height of an iframe such that it takes the height of an external website without showing the scrollbars. Thanks in advance

  • 3 Contributors
  • 4 Replies
  • 853 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by almostbob
Member Avatar for diafol

I may very well be wrong, but I don't think this is possible. You can certainly get rid of scrollbars, but the iframe is not aware of the size of the content AFAIK.

Edited by diafol
Member Avatar for almostbob

cant measure the external web page,
can make it fit the screen,
you get a scroll bar, inside the iframe, if the external site is bigger than 1 screen, appears close to the same site not in an iframe

<script type="text/javascript">
    function sizer() { var viewportheight;
    if (typeof window.innerWidth != 'undefined') { viewportheight = window.innerHeight }
    else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) { viewportheight = document.documentElement.clientHeight }
    else { viewportheight = document.getElementsByTagName('body')[0].clientHeight }
    document.getElementById('IFRAMEID').style.height=viewportheight; }
    document.onload = sizer();
    document.onresize = sizer(); </script>






<iframe id='IFRAMEID' width='100%'>

many sites wont allow their content in an iframe, they use a framebreaker script

<script type='text/javascript'>
<!--//
if (window != top) { if (top.location.href.indexOf("translate") < 0) {top.location.replace(self.location.href);} }
//-->
</script>
Edited by almostbob
Member Avatar for os.kwesi

Thanks almostbob. I am new to this. How should I implememt this code and where should I put the source URL. Below is an example of what I have

<iframe src="http:/www.abc.com" width="100%"></iframe>

Thanks

Member Avatar for almostbob

javascripts go in the <head>
the iframe call at the bottom, it is only an example
Modify your iframe to have the id referenced in the script
<iframe id='IFRAMEID' src="http:/www.abc.com" width="100%"></iframe>

the second script is not part of it, just an eample of a framebreaker, googleyahoo translate aware, in case the target site won't stay in your iframe, to let you see what is possible, no way to undo their framebreaker on your site

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.