Html 动态创建iframe_Html_Css_Iframe

Html 动态创建iframe

html css iframe

Html 动态创建iframe,html,css,iframe,Html,Css,Iframe,我想在点击按钮时动态创建一个iframe，并并排加载它。但它是一个接一个的请帮忙这是我的密码 <!DOCTYPE html> <html> <style> .box{ width:100%; float:left; } </style> <div class="box"> <iframe width="100%" scrolling="yes" height="630" src="window.html"> &l

我想在点击按钮时动态创建一个iframe，并并排加载它。但它是一个接一个的

请帮忙

这是我的密码

<!DOCTYPE html>
<html>
<style>
.box{
width:100%;
float:left; 
}

</style>

<div class="box">
<iframe width="100%" scrolling="yes" height="630"  src="window.html">
</iframe>
</div>

<div class="box">
<iframe width="100%" scrolling="yes" height="630"  src="window.html">
</iframe>
</div>
</html>


.盒子{
宽度：100%；
浮动：左；
}

我的window.html是：

<!DOCTYPE html>
<html>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script>

 <script type="text/javascript">
 $(document).ready(function(e) {

  $('#apDiv2').click(function(e) {
  alert('sdf');
 });   

  });
  </script>
   <head>
 <style type="text/css">
 #apDiv1 {
position: absolute;
width: 933px;
height: 115px;
z-index: 1;
left: 94px;
top: 138px;
 }

 #apDiv3 {
position: absolute;
width: 56px;
height: 54px;
z-index: 1;
left: 1174px;
top: -117px;
}
 #apDiv2 {
position: absolute;
width: 54px;
height: 52px;
z-index: 2;
left: 1267px;
top: 422px;
}
 #apDiv4 {
position: absolute;
width: 77px;
height: 76px;
z-index: 3;
left: 1019px;
top: 412px;
}
 #apDiv5 {
position: absolute;
width: 558px;
height: 50px;
z-index: 4;
left: 153px;
top: 413px;
 }


$（文档）.ready（函数（e）{
$（'apDiv2'）。单击（函数（e）{
警报（“sdf”）；
});   
});
#apDiv1{
位置：绝对位置；
宽度：933px；
高度：115px；
z指数：1；
左：94px；
顶部：138px；
}
#第3章{
位置：绝对位置；
宽度：56px；
高度：54px；
z指数：1；
左：1174px；
顶部：-117px；
}
#apDiv2{
位置：绝对位置；
宽度：54px；
高度：52px；
z指数：2；
左：1267px；
顶部：422px；
}
#第四章{
位置：绝对位置；
宽度：77px；
高度：76px；
z指数：3；
左：1019px；
顶部：412px；
}
#第五章{
位置：绝对位置；
宽度：558px；
高度：50px；
z指数：4；
左：153px；
顶部：413px；
}


在closs按钮上
拉

实际上，我想在第一个iframe的一侧加载一个新的iframe

定义它们的宽度，然后使用

float

在它们各自的一侧对齐它们

否则，

div

是

块

级别元素。这需要整条线。您应该将它们的宽度设置为

50%

，然后将它们相互对齐。

只需从代码中删除以下行：

<div class="box">
    <iframe width="100%" scrolling="yes" height="630"  src="window.html"></iframe>
</div>
<div class="box">
    <iframe width="100%" scrolling="yes" height="630"  src="window.html"></iframe>
</div>

并粘贴：

<iframe width="20%" scrolling="yes" height="400"  src="window.html" style="border: 10px solid red;"></iframe>
<iframe width="10%" scrolling="yes" height="400"  src="window.html" style="border: 10px solid green;"></iframe>

您不应该更改window.html文件中的任何内容。运行它并享受它

祝你好运

但我需要创建div dynamicali。我需要这样的结果。：但我需要创建div dynamicali。我需要这样的结果：childersc.com/projects/multisite请帮助

<iframe width="20%" scrolling="yes" height="400"  src="window.html" style="border: 10px solid red;"></iframe>
<iframe width="10%" scrolling="yes" height="400"  src="window.html" style="border: 10px solid green;"></iframe>