動態設置iframe高度;不工作ie和鉻

我想設置動態使用JavaScript和JQuery的iframe的高度。動態設置iframe高度;不工作ie和鉻

但由於原因，這不是在Ie8 &鍍鉻。（但它在Firefox上工作正常）

可以請一些身體幫忙嗎？

感謝

function resizePanel() { 
     window.console.log("ran the resize panel function"); 
    var frame = document.getElementsByTagName('iframe')[0]; 
    if(frame != null) { 

     var height;    
     if(self.innerHeight) { 
      window.console.log("ran the self.innerHeight"); 
      height= self.innerHeight;        
     } 
     else if (document.documentElement && (document.documentElement.clientHeight)) { 
      window.console.log("ran the clientHeight"); 
      height = document.documentElement.clientHeight;       
     } 
     else if(document.body) { 
      window.console.log("ran the document.body"); 
      height = document.body.clientHeight;    
     } 
     frame.style.height = height - 165 + 'px'   
    }}; 

    $(document).ready(function() { 
     resizePanel(); 
     $(window).resize(function() { 
      resizePanel(); 
     }); 
    }); 

    var prm = Sys.WebForms.PageRequestManager.getInstance(); 
    prm.add_endRequest(EndRequest); 

    function EndRequest(sender, args) { 
     resizePanel(); 
    }

來源

2012-01-30 Vin05

該代碼通過更改一行就可以在所有瀏覽器上正常工作。

而不是使用

var frame = document.getElementsByTagName('iframe')[0];

使用

var frame = document.getElementById("ctl00_ctl00_ContentPlaceHolder1_Options_iframe");

問題的是Chrome和IE有隱藏的iframe的，當我們使用的getElementsByTagName返回我們所有的I幀的陣列。所以我們嘗試訪問[0]索引，它指的是其他一些iframe。

我希望這會有所幫助。

完整的代碼是：

function resizePanel() { 

     var frame = document.getElementById("ctl00_ctl00_ContentPlaceHolder1_Options_iframe"); 
    if(frame != null) { 

     var height;    
     if(self.innerHeight) { 

      height= self.innerHeight;        
     } 
     else if (document.documentElement && (document.documentElement.clientHeight)) { 

      height = document.documentElement.clientHeight;      
     } 
     else if(document.body) { 

      height = document.body.clientHeight;    
     } 
     frame.style.height = height - 165 + 'px' 

    }}; 

    $(document).ready(function() { 
     resizePanel(); 
     $(window).resize(function() { 
      resizePanel(); 
     }); 
    }); 

    var prm = Sys.WebForms.PageRequestManager.getInstance(); 
    prm.add_endRequest(EndRequest); 

    function EndRequest(sender, args) { 
     resizePanel(); 
    }

來源

2012-01-31 14:32:17 Vin05

你的代碼看起來略顯複雜，你可能只是做到以下幾點：

function resizePanel() { 
    window.console.log("ran the resize panel function"); 
    var frame = document.getElementsByTagName('iframe')[0]; 
    if(frame != null) { 
     frame.style.height = frame.contentWindow.document.body.scrollHeight + "px"; 
    } 
}

應在所有主要的瀏覽器。

來源

2012-01-30 16:28:55

動態設置iframe高度;不工作ie和鉻

回答

相關問題