2

我已按照此处此处的说明进行操作,但无法正确实现 easyXDM 以自动调整 iframe 的高度。

在带有 iframe (host.html) 的页面上,我可以看到我正在导入的内容 (otherdomain.html),但 iframe 的高度比内容短得多,并且高度没有变化。不幸的是,这是在我无法链接到此处的开发站点上。

otherdomain.html 具有在单击时展开的元素,因此我需要 iframe 在页面内容时展开和收缩。

谁能告诉我我做错了什么?这是我正在使用的两个不同的域/服务器。这是我第一次设置套接字或做类似的事情 - 我在控制台中没有看到任何错误,但我无法理解它告诉我的内容。

这是一个类似的问题,但没有得到回答:IFrame resizing with easyXDM

这是我在具有 iFrame 的页面上的内容:

        <style type="text/css">
            div#embedded iframe {
                width: 725px;
            }
        </style>  
        <script src="../js/easyXDM.debug.js" type="text/javascript"></script> 
        <script type="text/javascript" language="javascript">
        new easyXDM.Socket({
            remote: "http://lcoawebservices.com/careers/resize_intermediate.html?url=job-postings.php",
            container: "embedded",
            onMessage: function (message, origin) {
                var settings = message.split(",");
                this.container.getElementsByTagName("iframe")[0].style.height = settings[0];
                this.container.getElementsByTagName("iframe")[0].style.width = settings[1];
            }
        });

        </script>
        <div id="embedded"></div>

这是我在 resize_intermediate.html 上的内容:

                    <script type="text/javascript" src="../scripts/easyXDM.debug.js">
                </script>
                <script type="text/javascript">
                    var iframe;
                    var socket = new easyXDM.Socket({
                        swf: "../scripts/easyxdm.swf",
                        onReady: function(){
                            iframe = document.createElement("iframe");
                            iframe.frameBorder = 0;
                            document.body.appendChild(iframe);
                            iframe.src = easyXDM.query.url;
                        },
                        onMessage: function(url, origin){
                            iframe.src = url;
                        }
                    });
                    //Probe child.frame for dimensions.
                    function messageBack(){
                        socket.postMessage ( iframe.contentDocument.body.clientHeight + "," + iframe.contentDocument.body.clientWidth); 
                    };

                    //Poll for changes on children every 500ms.
                    setInterval("messageBack()",500);
                </script>
                <style type="text/css">
                    html, body {
                        overflow: hidden;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                        height: 100%;
                    }

                    iframe {
                        width: 100%;
                        height: 100%;
                        border: 0px;
                    }
                </style>

在我正在导入的页面底部,我放置了这个:

        <script type="text/javascript">
            window.onload = function(){
                parent.socket.postMessage(document.body.clientHeight || document.body.offsetHeight || document.body.scrollHeight);
            };
        </script>
4

0 回答 0