div内iframe无法自适应宽度_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:36:42
Original
1589 Leute haben es durchsucht

这是我的页面:

<body style="height:100%width:100%;overflow:hidden;" onLoad="onload();"><div style="margin:0;padding:0;border:0px;height:100%;width:100%;position:absolute;">	<div class="top">		<div class="logo"></div>		<div class="top_right"><a href="">首页</a>  |  <a href="">帮助</a>  |  <a href="javascript:;">退出</a></div>	</div>	<div id="menu" style=" border:0px;padding:0; margin-top:-1px;width:75px;height:100%;float:left;">        <div class="left_1" style="margin:0px; padding:0px; border:0px; height:100%">			<ul>				<li id="li1"><img  id="pgjl" src="images/pgjl_green.png"    style="max-width:90%"  style="max-width:90%" onclick="menuclick(1);" style="cursor:pointer;"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" ></li>				<li id="li2"><img  id="pgy" src="images/pgy.png"    style="max-width:90%"  style="max-width:90%" onclick="menuclick(2);" style="cursor:pointer;"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" ></li>				<li id="li3"><img  id="tjfx" src="images/tjfx.png"    style="max-width:90%"  style="max-width:90%" onclick="menuclick(3);" style="cursor:pointer;"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" ></li>				<li id="li4"><img  id="kh" src="images/kh.png"    style="max-width:90%"  style="max-width:90%" onclick="menuclick(4);" style="cursor:pointer;"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" ></li>				<li id="li5"><img  id="xtgl" src="images/xtgl.png"    style="max-width:90%"  style="max-width:90%" onclick="menuclick(5);" style="cursor:pointer;"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" ></li>			</ul>		</div>	</div>	<div id="left" style=" border-left:0px;margin-left:-2px;margin-top:-1px;padding:0;height:100%;width:214px;position:relative;float:left;border:1px solid #CCC;">		<iframe  id="LeftFrame" name="LeftFrame" width="100%" height="100%" src="page/jk/menu.html" frameborder="0"scrolling="no" noresize="noresize"> 浏览器不支持嵌入式框架,或被配置为不显示嵌入式框架。 </iframe>	</div>	<div id="image" style="float:left;position:relative;border:0px"> <img  src="images/right.png" id="img_menu" title="关闭左栏"   style="max-width:90%"/ alt="div内iframe无法自适应宽度_html/css_WEB-ITnose" > </div>	<div id="centerdiv"  style="height:100%;width:80%;overflow:auto;border:0px;float:left;overflow:hidden; position:relative">		<iframe id="frameMap" name="frameMap"  style="max-width:90%" width="100%" frameborder="0"  scrolling="no" marginwidth="0" marginheight="0" src="" style="float:left; position:relative;"></iframe>	</div></div></body>
Nach dem Login kopieren

图1

图2

最下面的一个id为"frameMap"的iframe无法自适应宽度,如果在外部div指定宽度为100%后,下面这个iframe就看不到了。
当把左边的div隐藏后这个iframe只是位置向左浮动了,宽度并没有自适应。请教


回复讨论(解决方案)

想iframe宽度自适应,最好用JS

想iframe宽度自适应,最好用JS


js要怎么做?iframe不固定宽度看不到,固定宽度后不能拉伸,而且当浏览器变下后也看不到 了 


想iframe宽度自适应,最好用JS


js要怎么做?iframe不固定宽度看不到,固定宽度后不能拉伸,而且当浏览器变下后也看不到 了 

使用jquery方法,假设你的框架iframe的id为theFrame

function setSize(){
$('#theFrame').css("width",$(window).width());
}

//页面加载时设框架款宽度
$(document).ready(function (){
setSize();
}); 
  
//人工拖扯窗口大小时,重设框架款宽度
$(window).resize(function () { 
setSize();
});

我的  http://www.coding99.com/fe/show_48.html 可以看看 互相学习  

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage