javascript - iframe 在博主博客中不起作用

Question

嗨，我在我的博主博客中使用 iframe 全高。

使用的 CSS 是：

#iframe {
   height: 100%; 
   width: 100%; 
   display: block;
   border:0;
   margin:0;
   padding:0;
}

和Javascript是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
    var height = window.innerHeight;

    $(document).ready( function(){
       $('iframe').css('height', height);
    } );
</script>

和 HTML 是：

<iframe id="iframe" src="http://mybloggertricks.com"></iframe>

我已经在 Dreamviewer 中使用相同的上述属性对其进行了测试，它在 IE 中也可以正常工作。但仅在博客中它仅在 IE 浏览器中不起作用。请帮助我解决这个问题请帮助。

在此处查看该博客：http: //new-temp.blogspot.com/2012/12/my-blogger-tricks.html

Answer 1

Iframe to monitor his load, code like this:

 var height = window.innerHeight, iframe = $('iframe');
 iframe.load(function(){
     setTimeout(function(){
         iframe.css('height', height);
     }, 100);
 });

Answer 2

这是一个将博客 iframe 添加到博客的工具：http: //www.makingdifferent.com/online-iframe-generator-tool-for-blogwebsite/

如果那没有帮助。您也许可以使用以下代码作为指南。只需将整个代码复制并粘贴到博主的页面或帖子中，即可查看 iframe 如何扩展 100% 高度的测试。

如果您不希望宽度扩大 100%，只需更改所有宽度部分以匹配您所需的宽度：

<style>
#inside-iframe {
height:100%;
width:100%;
position: fixed;
scroll: no;
top:0px;
left:0px;
padding:0px;
z-index:9999;
}

body {
width:100%; 
height:100%; 
}
html {
width:100%; 
height:100%; 
}
</style>

<div id="inside-iframe">
<object width="100%" height="100%"><embed src="http://mybloggertricks.com" width="100%" height="100%"></embed></object>
</div>