我想从我自己的服务器中使用 iframe/嵌入一个页面并将高度设置为自动。我做了一些研究,结果发现我无法达到汽车的高度。我正在尝试实现这样的目标:http://themeforest.net/item/king-responsive-multipurpose-wordpress-theme/full_screen_preview/12354623
这是我到目前为止尝试过的:
HTML:
<iframe class="forum-embed" src="forum/index.php"></iframe>
CSS:
.forum-embed {
width: 100% !important;
height: 100% !important;
border: none;
}
PS:Themeforest 也使用 iframe。
最佳答案
您可以计算浏览器窗口/文档的高度,然后设置iframe的高度。
如果你正在使用 jquery,你可以这样做:
$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document
如果您在为 themeforest 发布的链接上查看源代码,您可以看到他们是如何做到的……从他们的源代码中……
//function to fix height of iframe!
var calcHeight = function() {
var headerDimensions = $('.preview__header').height();
$('.full-screen-preview__frame').height($(window).height() - headerDimensions);
}
$(document).ready(function() {
calcHeight();
});
$(window).resize(function() {
calcHeight();
}).load(function() {
calcHeight();
});
关于javascript - iframe 的自动高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33131827/