dd

自动设置iframe高度,实现iframe高度自适应

jerry PHP 2015年11月18日 收藏
自动设置iframe高度,供第三方调用,实现iframe高度自适应;
这个可以解决跨域问题。
iframe 如下
<iframe id="showFrame" src="{:C('AuditResource')}" width="100%" height="620" border="0" frameborder="0"></iframe>
iframe 的src地址包含如下代码片段:
<iframe width="0" height="0" style="display: none;" src="http://domain/setIframeHeight?#300" name="iframeA" id="iframeA"></iframe>
 <script type="text/javascript">
        try {
            function sethash() {
                var hashH = document.documentElement.scrollHeight;
                var urlC = "http://domain/setheight.html";
                document.getElementById("iframeA").src = urlC + "#" + hashH + "#" + Math.random();
            }
        } catch (e) { }
    </script>
http://domain/setIframeHeight 的代码如下:
    /**
     *自动设置iframe高度,供第三方调用,实现iframe高度自适应
     */
    public function setIframeHeight() {
        header("Content-type: text/html; charset=utf-8"); 
        echo '<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />';
        echo '<script type="text/javascript">
            var b_iframe = parent.parent.document.getElementById("showFrame");
            //var app_show_left = parent.parent.document.getElementById("aside_left");
            var hash_url = window.location.hash;
            var hash_width = hash_url.split("#")[1].split("|")[0];
            var hash_height = hash_url.split("#")[1].split("|")[1];
            if(undefined==hash_height) {
                hash_height = hash_width;
                hash_width = 0;
            }
            //b_iframe.style.width = hash_width;
            b_iframe.style.height = hash_height+"px";
            </script>';
    }
dd