iframe框架自动适应高度

 

 1  按照下面方法自适应高度

2  替代方法 在引用iframe的页面中

   1)页面加载的时候将页面可视区域的高度给iframe

    2)当页面改变大小时候(事件为resize)将页面可视高度给iframe

    3)iframe添加滚动条 style="overflow-x:hidden;overflow-y:auto"

 

 

 

//iframe 自动高度
function iframeautoHeight( iframeobj ){
	if ( iframeobj.attachEvent) {
	      iframeobj.attachEvent("onload",
	      function() {
	    	  iFrameHeight() ;
	      });
	 } else {
	     iframeobj.onload = function() {
	    	 iFrameHeight() ;
	     };
	 }
}
 

function iFrameHeight() {
	var ifm= document.getElementById("rightcontent"); 
	var subWeb = document.frames ? document.frames["rightcontent"].document : ifm.contentDocument; 
	if(ifm != null && subWeb != null) { 
		ifm.height= $(subWeb).find("div[id='main-content']").height();
	} 
} 


方法2 jquery 写法--------------

$(document).ready(function(){

	document.domain="baidu.com";
	$("#contentIfm").load(function(){
		//$('#log').html(  "进来了。。。");      
	    var height = $(this).contents().find("#content").height() + 40;  
	    
	   //这样给以一个最小高度  
		$(this).height(height);
		$('#log').html( $('#log').html()+","+height);
		$('body,html').scrollTop( 0); 
	  
	}); 
})

 

 

 

你可能感兴趣的:(iframeobj)