0

我通过谷歌搜索在互联网上找到了大约 5 种方法,但它们似乎都不起作用……我看到人们感谢并说它有效,我只是因为它对我和我不起作用而感到沮丧不知道为什么。

我有两个文件,包含 iframe 的test.html和具有实际内容的hello.html 。我希望 test.html 中的 iframe 根据 hello.html 中的内容来适应它的高度。我正在使用的教程:http ://css-tricks.com/snippets/jquery/fit-iframe-to-content/ 以下是代码:

测试.html

    <html>
<head>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type='text/javascript'>

    $(function(){

        var iFrames = $('iframe');

        function iResize() {

            for (var i = 0, j = iFrames.length; i < j; i++) {
              iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
            }

            if ($.browser.safari || $.browser.opera) { 

               iFrames.load(function(){
                   setTimeout(iResize, 0);
               });

               for (var i = 0, j = iFrames.length; i < j; i++) {
                    var iSource = iFrames[i].src;
                    iFrames[i].src = '';
                    iFrames[i].src = iSource;
               }

            } else {
               iFrames.load(function() { 
                   this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
               });
            }

        });

</script>
</head>

<iframe src="hello.html" class="iframe" scrolling="no" frameborder="0"></iframe>
<html>

你好.html

<html>
<body bgcolor=”#000000″&gt;

<font color=”#ffffff”&gt;
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
<p>Child frame.</p>
</font>

</body>
</html>

这就是我得到的:

在此处输入图像描述

4

0 回答 0