gpt4 book ai didi

javascript - 为 Iframe 的父 div 标签设置宽度

转载 作者:太空宇宙 更新时间:2023-11-04 15:07:19 25 4
gpt4 key购买 nike

我在 div 中有一个 iframe(作为弹出窗口),其高度和宽度可以可变。我尝试以所有可能的方式设置高度和宽度,但我没有成功。
我无法理解原因。 有人能帮帮我吗?这是一个jsbin

这是我认为应该有效的代码:

<!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>

最佳答案

如果我正确理解您的问题,您必须先设置“irmNPopupContent”高度和宽度,然后再设置 iframe src。开始你的脚本:$('#irmNPopupContainer').css({width:_width+"px",height:_height+"px"});

看看这个jsbin:jsbin.com/oxemet/4

关于javascript - 为 Iframe 的父 div 标签设置宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15739283/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com