javascript - 如何调整我的 iframe

标签 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>

最佳答案

您可以只允许 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%;
    }

关于javascript - 如何调整我的 iframe,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30710998/

上一篇:html - 使用滚动将 child 定位在 parent 的底部

下一篇:html - css - 三 Angular 形边框 100% 的屏幕

相关文章:

javascript - iframe 中的按钮使 div 显示在父级中

javascript - Action方法执行顺序

Javascript 格式不是函数

html - 变换 : translateX causes text blur

javascript - 如何循环遍历数组并将其传递给 Google 应用脚本中的 HTML 模板

javascript - jquery onblur 不触发

javascript - 如何在 ListView 上实现滑动功能(react-native)?

javascript - jQuery slider PHP/HTML 问题

javascript - 如何在mvc中的jquery中使用@符号

html - 如何在选择元素上使用 inset box-shadow?