我该如何调整我的iframe

时间:2015-06-08 13:53:23

标签: javascript jquery html css iframe

我试图用一个滚动条调整我的iframe并自动调整iframe,但我不知道怎么做。我怎样才能做到这一点?。代码在这里



<style type="text/css">
html {
	height: 100%;
}
body {
	height: 100%;
	margin: 0px;
	padding: 0px;
}

</style>

<body>

<iframe src='http://www.dohop.com/widget/2/?forms=flights&target=&tabs=top&orientation=horizontal&border_color=808080&text_color=202020&background_color=D0D0D0&form_border_color=808080&form_text_color=000&form_background_color=FAFAFA&width=1000&flang=es&whitelabel=http://vuelos.gangatravel.es/' scrolling='yes' width='1000' height='250' frameborder='0' style='border:none; overflow: hidden;' allowtransparency='true'>
</iframe>
<div style='text-align: right; width: 1000px; display:block; margin-top:5px;'>
	<a href='http://www.dohop.com' style='font-size:10px;text-decoration:none;color:#007BA4;'></a>
</div>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

您可以让iframe占据整个宽度并隐藏body溢出。为此,请将HTML修改为以下内容,

<body>

<iframe src='http://www.dohop.com/widget/2/?forms=flights&target=&tabs=top&orientation=horizontal&border_color=808080&text_color=202020&background_color=D0D0D0&form_border_color=808080&form_text_color=000&form_background_color=FAFAFA&width=1000&flang=es&whitelabel=http://vuelos.gangatravel.es/' scrolling='yes' frameborder='0' style='border:none;' allowtransparency='true'>
</iframe>
<div style='text-align: right; width: 1000px; display:block; margin-top:5px;'>
    <a href='http://www.dohop.com' style='font-size:10px;text-decoration:none;color:#007BA4;'></a>
</div>

</body>

使用以下CSS,

    iframe{
        min-width:100px;
        width:100%;
        height:100%;
    }
    body{
        overflow:hidden;
        height: 100%;
        margin: 0px;
        padding: 0px;
    }   
    html {
        height: 100%;
    }

答案 1 :(得分:1)

将以下内容添加到代码的head部分可能会解决问题

<script language="javascript" type="text/javascript">
 function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>

将其添加为iframe元素中的atttribute

onload='javascript:resizeIframe(this);'