如何让iframe里弹出的层显示在整个网页上

 时间:2024-10-12 03:05:46

1、在文件夹中创建两个文件,一个iframe页面,一个父页面index。

如何让iframe里弹出的层显示在整个网页上

2、打开父页面index,里面引入iframe页面。

如何让iframe里弹出的层显示在整个网页上

3、打开iframe页面,里面添加一个按钮。

如何让iframe里弹出的层显示在整个网页上

4、在浏览器中打开index,页面是这样的,一个按钮在iframe中。

如何让iframe里弹出的层显示在整个网页上

5、现在我们对iframe做修改,在button上监听onclick调用“show”方法,通过show动态在父页面body中创建一个div层并显示出来,把这个层style中的position:absolute,z-index设置足够大就会显示在顶层。function show() { var showdiv=document.createElement('div'); showdiv.setAttribute('id','topdiv'); showdiv.setAttribute("style",'position:absolute;z-index:999;width:300px;height:300px;'); var tt=document.createTextNode('我是iframe弹出层'); window.parent.document.body.appendChild(showdiv).appendChild(tt);}

如何让iframe里弹出的层显示在整个网页上

6、现在我们在浏览器中再次打开index页面,点击iframe页面的中的按钮“弹出层”,就会弹出一个蓝色的div层,在父页面内容之上显示出来。

如何让iframe里弹出的层显示在整个网页上
  • 怎么让js的for循环里创建不同的变量
  • js 判断是否为火狐浏览器
  • windows server 2003怎么安装FTP
  • jquery中怎样获得select选中的值?
  • 如何使用SQL Developer为表新建唯一约束条件
  • 热门搜索
    感恩的心手抄报 劳动最光荣手抄报内容 关于读书的手抄报图片 一二年级安全手抄报 中秋节手抄报图片 网络安全手抄报内容 童心向党手抄报图 关于健康的手抄报 五四青年节手抄报 自我介绍手抄报