目的：Egret里使用iframe标签达到内嵌多个web界面，模式相当于主swf调用N个子swf的效果；
目前在做项目过程中，在使用iframe的时候，碰到了一些功能需求，以及解决方法如下：

一、.在index.html里添加iframe标签，
在index.html的<body>标签下，添加iframe标签，包括：路径，宽，高，坐标X，Y，是否出现滚动条，等属性；
想要详细了解其意思的话，请阅读 http://www.w3school.com.cn/tags/tag_iframe.asp

有两种方法：
1.
<style type="text/css">
.wrapper
 { width:1104px; height:570px; margin:100px 30px; overflow:hidden; position:relative; }
 .iframe { width:1024px;height:768px; position:absolute; top:10px; left:50px; }
 </style>
<div class="wrapper">
<iframe class="iframe" src="http://www.baidu.com" scrolling="no" frameborder="0">
 </iframe>
 </div>
2.
<iframe id="page1" width=1104 height=570 frameborder=0 scrolling=auto src="resource/assets/Html/Mobile/index.html?v=<?=$ver?>" style="position: absolute; top: 100px; left: 200px;"></iframe>
 
二、添加标签完成之后，如何让iframe内容跟随主html进行缩放，
方法：
在 style 属性方法里，添加
width:100%;height:100%;

这句代码，就可以达到让iframe内容跟随主html进行缩放的效果；完整的代码如下：

 <iframe id="page1" width=1104 height=570 frameborder=0 scrolling=auto src="" style="width:50%;height:50%; position: absolute; top: 0px; left: 0px;"></iframe>

三、解决缩放问题后，如何控制iframe内容刷新，更换不同的链接呢？并且是在egret里进行控制
方法如下：
在 index.html里的<script>标签下，添加 函数，用来根据情况设定 iframe的src（可以考察：http://www.cnblogs.com/fanyf/p/3651523.html）
function setPage(bool)
{
    if(bool == false)
    {
    	var bgm = document.getElementById('page1');
        var name = "resource/assets/Html/PC/index.html?v=<?=$ver?>";
    	bgm.src = name;
    }else
    {
    	var bgm = document.getElementById('page1');
        var name = "resource/assets/Html/Mobile/index.html?v=<?=$ver?>";
        bgm.src = name;
    }
}
然后在egret代码里对这个函数进行引用，其方法如下：
window["setPage"](true);
到这步，基本功能就完成了；

四、但是有时候想清除iframe的内容，让他为空，隐藏，该怎么做呢？
方法如下：
需要把iframe的src设为空，页面就不会显示了，不过设为空之后，会出现一个404提示，我目前解决方法是添加一句  bgm.visible = false;不过这方法在chrome里能执行，在ie里没有效果
var bgm = document.getElementById('page1');
var name = " ";
bgm.src = name;
bgm.visible = false;

【Egret】里使用iframe标签达到内嵌多个web界面的更多相关文章

  1. 如何优雅的关闭基于Spring Boot 内嵌 Tomcat 的 Web 应用

    背景 最近在搞云化项目的启动脚本,觉得以往kill方式关闭服务项目太粗暴了,这种kill关闭应用的方式会让当前应用将所有处理中的请求丢弃,响应失败.这种形式的响应失败在处理重要业务逻辑中是要极力避免的 ...

  2. HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版

    昨天看到这篇文章[置顶]开源组件NanUI一周年 - 使用HTML/CSS/JS来构建.Net Winform应用程序界面 就想弄一个winform结合html5的一个小东西,突有兴致,想在里面嵌套一 ...

  3. iframe动态改变内嵌页面高度

    test.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://w ...

  4. HTML-图片热点、网页内嵌、网页拼接、快速切图

    图片热点 规划出图片上的一个区域,可以做出超链接,直接点击图片区域就可以完成跳转的效果.与图片链接不同,热点是图片上的某一个区域或多个区域. 我们用魔兽世界图片来做一个图片热点,点击logo.区域和不 ...

  5. iframe标签flash遮盖页面元素问题——wmode参数

    最近做项目过程中,遇到各种小问题,所以打算通过博客园来记录各问题的解决办法. 这篇的问题背景是这样子的:项目是用的AngularJS框架,在某个页面上用了wangEditor富文本编辑器插件(gith ...

  6. selenium - switch_to.frame()- 内嵌表单的切换

    表单嵌套frame/iframe webDriver只能在一个页面上对元素识别和定位,对于frame/iframe表单内嵌页面上的元素无法直接定位,此时就需要通过switch_to.frame()方法 ...

  7. PluginOK中间件高级版-支持在Chrome、Edge、Firefox等浏览器网页中真正内嵌ActiveX等控件运行的版本已获多家上市公司采购

    PluginOK(牛插)中间件(原名:本网通WebRunLocal)是一个实现WEB浏览器(Web Browser)与本地程序(Local Application)之间进行双向调用的低成本.强兼容.安 ...

  8. iframe框架里镶嵌页面；<marquee>：滚动效果；<mark>做标记；内联、内嵌、外联；选择器

    标签:①②③④⑤⑥⑦★ 框架: 一.frameset:(框架集) 1.如果使用框架集,当前页面不能有body 2.cols="300,*":左右拆分,左边宽300,右边宽剩余 3. ...

  9. django2 用iframe标签完成 网页内嵌播放b站视频功能

    前言: 给自己的网站中加入视频资源,有两种方法,一种是用iframe标签引用外站资源,另一种则使用video标签,获取站内资源进行视频播放.其中前者顾名思义,是将视频资源上传到视频网站中,然后通过引用 ...

随机推荐

  1. javase基础回顾（一）ArrayList深入解析 解读ArrayList源代码（JDK1.8.0_92）

    我们在学习这一块内容时需要注意的一个问题是 集合中存放的依然是对象的引用而不是对象本身. List接口扩展了Collection并声明存储一系列元素的类集的特性.使用一个基于零的下标,元素可以通过它们 ...

  2. 【异构计算】在Windows下使用OpenCL配置

    前言 目前,NVIDIA 和 AMD 的 Windows driver 均有支持OpenCL(NVIDIA 的正式版 driver 是从自195.62 版开始,而 AMD则是从9.11 版开始).NV ...

  3. 关于OpenGL和DX学习的取舍

    大家多知道左右就肯定要与显卡打交道.两大图形图像IPA.OpenGL(图形),DX(图形,声音,键盘控制,网络) OpenGL的兴起可能取决于苹果公司的适用,吸引看大部分开发者适用,它有跨平台的有点. ...

  4. MySQL入门笔记（一）

    一.数据类型 1. 整型 2. 浮点型 3. 字符型 4. 日期时间型 二.数据库操作 1. 创建库 CREATE {DATABASE | SCHEMA} [IF NOT EXISTS] db_nam ...

  5. 【Zookeeper】源码分析之请求处理链（四）

    一.前言 前面分析了SyncReqeustProcessor,接着分析请求处理链中最后的一个处理器FinalRequestProcessor. 二.FinalRequestProcessor源码分析 ...

  6. windows 2003装.net 4.0时提示 WIC windows Imaging Component

    运行此安装程序之前,必须安装32位windows映像处理组件(WIC) WIC windows Imaging Component下载地址: http://download.microsoft.com ...

  7. Kindle电子阅读器收不到个人文档推送解决方案

    最近我的 kindle 固件版本更新到 5.8.7.0.1 ,发现增加了生字注音功能,瞬间变成小学生阅读神器有木有,不过,这个功能可以隐藏.显示,看着碍眼隐藏即可,还可以减少和增加生字注音.感觉对于经 ...

  8. JMessage是让App 同时集成 Push 功能与 IM 功能最完美的方案

    历经几个月的沉寂,以及兄弟们的奋战,极光推送的兄弟产品诞生了:极光IM,英文名 JMessage. 极光IM 是我们团队基于大量客户的需求反馈,在很多客户的殷切期盼下所开发的.团队成员一方面要支撑极光 ...

  9. [HDUOJ1312]Red And Black (经典的DFS)

    Hot~~招聘——亚信科技,巴卡斯(杭州),壹晨仟阳(杭州),英雄互娱(杭州) (包括2016级新生)除了校赛,还有什么途径可以申请加入ACM校队? Red and Black Time Limit: ...

  10. JavaScript数据结构——栈的实现

    栈(stack)是一种运算受限的线性表.栈内的元素只允许通过列表的一端访问,这一端被称为栈顶,相对地,把另一端称为栈底.装羽毛球的盒子是现实中常见的栈例子.栈被称为一种后入先出(LIFO,last-i ...