Javascript 将宽度设置为Iframe'；s父div标记_Javascript_Jquery_Css_Html

Javascript 将宽度设置为Iframe'；s父div标记

javascript jquery css html

Javascript 将宽度设置为Iframe'；s父div标记,javascript,jquery,css,html,Javascript,Jquery,Css,Html,我在一个div中有一个iframe（作为弹出窗口），它的高度和宽度可以是可变的。我尝试用所有可能的方法设置高度和宽度，但没有成功我无法理解原因。有人能帮帮我吗？这是一个下面是我想应该可以使用的代码： <!DOCTYPE HTML PUBLIC> <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></sc

我在一个div中有一个iframe（作为弹出窗口），它的高度和宽度可以是可变的。我尝试用所有可能的方法设置高度和宽度，但没有成功
我无法理解原因。
有人能帮帮我吗？这是一个

下面是我想应该可以使用的代码：

<!DOCTYPE HTML PUBLIC>
<html>
 <head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>

<style type="text/css">
   #irmNPopupContainer {
       border: 2px solid;
       display: none;
       top: 10px;
       left: 10px;
   }

   #irmNPopupHdr {
       height: 30px;
       width: 100%;
       background: #F0F0F0;
   }
</style>
 </head>

 <body>

  <button onClick="showIrmNPopup('Window Title','http://www.w3schools.com',200,200)">W3 Schools</button> <br/> 

  <div id="irmNPopupContainer" >
     <div id="irmNPopupHdr"><span></span><span><img src="round_black_close2.png" title="Close">X</span></div>
     <div id="irmNPopupContent" >
       <iframe frameborder=0 id="irmNPopupContentFrame" name="irmNPopupContentFrame" scrolling=auto width="100%" height="100%">
       </iframe>
     </div>
  </div>
 </body>

  <script>
  function showIrmNPopup(_title,_src,_width,_height){
  //Assign source to iframe and set width and height of the iframe
   var iframeObj = document.getElementById('irmNPopupContentFrame');
   iframeObj.src = _src;

   $('#irmNPopupHdr span:first-child').text(_title);
   $('#irmNPopupContainer').show(600);   
  // $('#irmNPopupContainer').outerWidth(_width);
   //$('#irmNPopupContainer').outerHeight(_height);
   $('#irmNPopupContainer').css({width:_width+"px",height:_height+"px"});
 // document.getElementById('irmNPopupContainer').style.width = _width+"px";
 }
 $('#irmNPopupHdr span:last-child').click(function(){
   $('#irmNPopupContainer').hide(600);  
 })
  </script>

</html>


#irmNPopupContainer{
边框：2倍实心；
显示：无；
顶部：10px；
左：10px；
}
#irmNPopupHdr{
高度：30px；
宽度：100%；
背景：#f0；
}
W3学校

X
函数showIrmNPopup（_title，_src，_width，_height）{
//将源指定给iframe并设置iframe的宽度和高度
var iframeObj=document.getElementById（'irmNPopupContentFrame'）；
iframeObj.src=_src；
$（'irmNPopupHdr span:first child'）。文本（_title）；
$（'irmNPopupContainer'）。show（600）；
//$（'irmNPopupContainer'）。外套宽度（_宽度）；
//$（'irmNPopupContainer'）。外部高度（'u高度）；
$（'irmNPopupContainer'）.css（{width:_width+“px”，height:_height+“px”}）；
//document.getElementById（'irmNPopupContainer'）。style.width=_width+“px”；
}
$（'#irmNPopupHdr span:last child'）。单击（函数（）{
$（'irmNPopupContainer'）。隐藏（600）；
})

如果我正确理解您的问题，您必须先设置“irmNPopupContent”的高度和宽度，然后再设置iframe src。从以下内容开始编写脚本：

$（'irmNPopupContainer'）.css（{width:_width+“px”，height:_height+“px”}）
看看这个jsbin:
如果我理解您的问题，您必须在设置iframe src之前先设置“irmNPopupContent”。用$（'#irmNPopupContainer'）.css（{width:_width+“px”，height:_height+“px”）启动脚本；看看这个：@IrvinDominin谢谢你。评论作为答案发布；很高兴帮助你。