iframe嵌入页面怎么解决

网页上除了可以嵌入视频和音频之外，还可以嵌入第三方网页，需要用到这个 iphone 元素，这个叫泪点框架元素，他可以把另一个界面页面嵌入到当前页面中。用法也很简单，直接写一个 iphone m， 需要给他一个 src 属性，比如我们就写一个 gbs 三 w 点宾利，宾利点 com。 这个 freeboder 是用来指定是不显示边框的，零表示不显示，一表示显示默认就是一，不过边框是属于样式的范畴，所以这个属性我们一般都会把它指定成零，不显示边框。然后通过 cs 来设置样式。来看一下他们三个都是水平排列的，说明都是行和。可以来看一下他们的 display， 他是韩豪对吧？ outdoor 也是， iphone 也是，但他们都可以设置尺寸，这是可替换演说的特点。 vdo 我们改过了，再来改下。 outdoor 可以看到浏览情报的样式，这里给他设了一个宽高三百乘五十四，那我们来改下 它的宽度，五百像素变长了，对吧？再来个 head 三百像素高度也变了。当然 iphone 也可以改尺寸，我们来代码，你改宽度百分之百，高度一千像素。这样我们就把 p 三迁到了我们的页面里面。 样式这里可以看到他这里写了个 attribute style 属性样式，也就是我们设置的这个 freerenboder， 他提供的样式设置了四个方向的边框，宽度为零，然后我们把他这个属性改成一， 刚刚的属性样式就没有了，只剩下浏览节目的样式，这里把 boder face 改成了两个像素。这个 iphone 展开之后，里面是一个完整的必战网页。 ok， 前面我们再来写两个元素，这个就还是 b 站吧。再来一个高德地图 in map 点 com 保存。默认情况下，当我们点击 b 站的时候，他会在当前标间页打开，对吧？如果希望他在新标间页 打开，就需要给他们加一个 target blank， 来看一下，没问题吧？但如果我的需求是在这个 iphone 里面打开呢？很简单，给这个 iphone 加个 name， 比如我们就叫 window， 然后这两个 target 改成 window， 这样就可以了。来看一下，当我点击高德地图，高德地图的页面就会在这里打开， 然后点击 b 站，也在这里面打开了。这个 iphone 元素我们通常用来迁到别人网站的视频，比如 b 站我随便点开一个视频， b 站的视频是不能直接下载的，我们拿不到他的视频文件地址，但他允许我们使用 iphone 元素把他的网页迁逃过来。可以点一下这个分享， 这里就有一个嵌入代码，点下它代码就复制好了，把它粘贴到我们的网页，看到了吗？这就是一个 iphone 元素，但是它这里没有带写意名， h d b s， 如果 s i c 录进没有写写意名，浏览器会默认用当前网页的协议。如果当前页面用带 h d p， 它就会用 h d p 写意访问这个地址，所以如果 写一名一样，他是可以省略的。如果没有学过网络编程的话，可能不太理解什么是协议，简单说，协议就是规定了数据用什么格式传输，比如我们的协议是隔一个空格写一个单词，那么你读的时候也是给一个空格读一个单词，我们共同遵守这个协议，你就可以理解我发的内容，我也可以理解你发的内容， 这就是协议的作用。或者你也可以理解为协议就是语言，我们都说汉语就可以正常沟通，如果我说汉语，你说英语，那就没法沟通。浏览器用 atb 协议请求，网站服务器用 atb 协议响应，他们就可以正常通信，不然肯定就无法通信，拿不到网站的数据。 b 站用的是 atps， 我们这里用的不是 atps， 所以不能省略，要加上 etps。 当然你会发现其实不加写移民也可以访问，这涉及到重定向相关知识，不是我们这里讨论的重点。然后他这里还有一些属性，都是一些样式上的东西，不用管他们都可以用 cs 来控制的。 打开来看一下视频就迁入进来了，有点小，对吧？可以改下尺寸，宽度一千像素，高度五百像素。 okay fm 我们就讲这么多。

框架的标签是 fm， 所有的浏览器都支持 fm 标签。框架有一些属性，边框属性， fm border 高度， high 宽度， weight name 名称， c o， n 滚动条，滚动条呢有几个属性值？ us， do o t ssc 框架中嵌套的页面地址，我们通过一个小例子来了解一下框架的具体使用，打开 notepad 加加， 今天我们要做一个什么样的小例子呢？我们知道现在很多的管理系统都采用了框架作为布局， 其中最常用的就是左右式布局，今天呢我们就做一个左右式的一个框架布局。首先呢我们要新建一个主页面， 我们给它起名为 may html， 然后我们再新建一个页面，这个页面呢是左侧页面， 我们起名为 wes html。 下面我们再新建一个页面， 这个页面呢是右侧页面。 那右侧页面呢？因为有好多个，所以呢我这里 light 提示 t a n l 就是作为默认的打开的一个页面。 我们预览一下主页，主页面显示没有问题，但是我们考虑一下怎么着把我们刚才建的这个左侧页面和右侧页面嵌套到我这个主页面里面呢？ 我们需要使用 ic h a 里面呢有一个 s s c 属性可以链接到我们的页面， 这里呢我首先嵌套一个左侧页面，然后再嵌套一个右侧页面。 好，我们再预览一下左侧页面，右侧页面出来了，没有问题， 下面呢我想让这两个框架呢放到主页面这个文字下面，怎么实现呢？很好办，换行就可以了， 刷新好的左侧页面，右侧页面，那现在呢，我想把右侧页面宽度加大一些，怎么设置呢？我们可以使用它的 vd 属性， v d 属性呢，可以使用具体的像素值，比如说五百 p x， 也可以使用百分比，比如说百分之七十五 vs 呢，也可以使用百分比， 百分之二十。 好，那我现在呢想把这两个框架的高度呢再加大一些，怎么办呢？我也可以使用 high 属性。 好，现在宽度和高度都有了。那接下来我要做的事情呢，就是左侧放一些菜单， 可以点击的菜单， 菜单呢是一个列表，我呢要需要使用 u l 标签， 这里呢，我暂时设置三个菜单，第一个菜单是员工管理， 第二个菜单是客户管理，第三个菜单是订单管理。好，预览一下看效果。 三的菜单已经出来了，但是呢，现在这三的菜单还不能点击，如果想让他可以点击的话，我们需要使用 a 标签，也就是给他加一个超链接。 好，到目前为止呢，这三个菜单已经可以点击了，我们鼠标放上去的时候，他已经呈现了一个小手状，但是点击的话没有任何的动作产生，因为我还没有给 a 标签的 left 设置任何的值。 所以呢，我们得需要做三个页面，点击员工管理的时候，跳转到员工管理的页面，点击客户和 订单的时候，跳转到客户和订单的页面，继续新建三个页面， 员工管理我给他起名 m h t a v o。 客户管理界面，我给他起名 acony html， 订单管理，我给他 起名 order html。 好，三个页面创建完毕， 下面我需要把这个链接对应过去， 再预览一下我们的网页，点击左侧的员工管理， 跳转了，确实跳转了，但是呢不是我们想要的跳转效果，我们想要的效果呢，是点击左侧的页面的时候呢，在右侧这个框框里面出现相应的页面内容， 那这个时候怎么办呢？不要着急，我们看 f m 呢，它有一个属性，内幕属性好，这个时候就是内 属性登场的时候，我们给 light html 设置一个 name， 之后呢，我们在 a 标签里面设置一个 target tar god， 就是要跳转到的目标，这里呢写上我们刚才设置的 name， it 好了，再点击一次试试。员工管理，右侧成功的跳转到 了员工管理页面，客户管理，订单管理好，没有问题。我们看目前这个框架呢，有一个啊，很粗的一个边框，假如说我们想把这个边框取消，怎么办呢？我们可以设置它的 fameboder 出现， 把 fame buddha 的值设置为零。刚才我设置的是右边这个框架，刷新看边框消失了， 假如说我设置为一好，边框又出现了， 有些时候我们网页的内容呢会比较多，那一频可能显示不全，这时候怎么办呢？ 我们可以给这个框架呢，加一个滚动条，加一个 school 等于 us， 也就是说让右侧这个框架显示滚动条，你刷新一下看效果，不管内容有多少，它都能完整的形式。如果说我们不想让滚动条出现的话，我们可以把 vs 改成 no。 有些时候呢，我们可能想让框架的滚动条更加智能一些啊，比如说文字内容多的时候就显示，文字内容少的时候就不显示，那这个时候我们需要给 slow well 设置一个 o 透值。

哈喽，今天我要教大家怎么样从地方第三方拿到嵌入代码之后呢，还可以把它放到配具片的网站上面，还可以自动适应不同的屏幕，那我们就开始吧， 我以我们官方网站为例，我们这里有一个教程， 我们看一下效果，看下这里，你看一下这个就是西瓜视频的欠用代码，然后我又做到了，这里是可以自动适应的， 看下效果，看可以是在不同的屏幕上面，他都可以自动。 接下来我们看一下是怎么去做的， 之前呢我是用外联的方式去把它跳转到西瓜视频的，然后点击，但是我现在呢就需要放到我自己的站内， 那我们我就进入我的官方的后台，然后就打开这个 教程列表，点击这个列表，然后打开数据源， 你们看一下这个， 这个是通过外练的方式去跳到西瓜视频的， 然后上面这个呢我已经做好了，就是嵌入的是第三方的视频，然后我现在要把这个 也放到我们的站内，然后就可以用视频的方式展示，那我就打开 这里是一个视频，这里有一个分享，其实很多，呃， 其实很多视频平台他都有这个分享的，他都有一个嵌入的代码，我们就可以复制，基本上都是一样的，然后点击这个嵌入代码， 然后一键复制，再回到后台，后台这里后台这里有一个详细，那我们就在这里视频， 然后内线把这个代码放进去，确定这样就可以加进来了，我就要把这个外联删掉，不然他还会跳过去的，如果你填了这个外联，他是优先跳过去的， 再刷新，然后点击 好，这时候视频就加进来了，但是你看到了他是一个固定宽度还有固定高度的一个 视频，这样子呢，就没办法适应我们的小的屏幕，让我们看一下他的效果， 我现在用在不停的尺寸，你看一下他就是这样子的，是不是他会影响到小屏幕，这下面都出问题了， 这个是非常不友好的。然后我需要改一下， 我就看一下上一个是怎么改的。那我们点击原代码， 其实最不同的就是在这里加入了一个样式，就是视频的容器， 我们复制这里的代码，然后放到这边，这里没有加，我们加进去， ok， 确定了之后保存， 再去刷新一下，哎，就可以了， 然后效果也是一样的，可以适应屏幕，这就非常好了。 因为之前我啊比较偷懒，所以就把这个视频直接就跳到啊这个西瓜视频这里去，但是我后来发现我有些视频我需要在站内里， 就是可能视频下方我要写一些文字，还有贴一些图片，那为什么加了那个样式，他就 等实现了，那这段样式他是放在哪里呢？其实我们是放在那个详情页的组建的，呃，那里的，就好像现在我们访问的这个是详情页，那么后台 就有一个相应的教程，详情页 在这里， 点击这个文章组件，你看一下这里有个内部样式，这个内部样式就是我们的。呃，详情页，然后呢加入了这段样式， 就是这一段代码，这段代码呢我就会放在啊我那个我这个视频的下面，那你们可以直接复制去使用 这个代码也是我啊，遇到这个问题的时候，我就从网上找了一下啊，就找到了这个代码，这个是十六比九的一个视频的一个尺寸， 如果，如果你这张代码他只针对这个组件有效的，如果你想 整个网站，如果你想整个网站都有效呢？那就把这个代码可以放到这里的自定义代码这里，这里有个全局样式， 你可以把它放在这里，放到这里，这样子呢，他就可以整个网站都会加载到这个代码。如果你放的视频，我做的是可能是视频的网站到处都要用到，那这样子放了就会比较好 啊。我这里呢就没有必要，因为其他页面是用不到的，只有那个主见才用到，所以我只需要加到那个主见就可以了， 在我这里是不加的。 ok， 今天就教到这里。其实啊，这款代码也是非常简单，加入进去就可以用到 第三方的。呃，这个内向代码还可以自动适应，所以就非常的不错。好了，拜拜。

在上一节课，我们完成了我的信息页面的资助，但是我们会发现这个菜单还没有像前面的这些菜单一样使用 gs 统一去实现。 这节课我们就修改这一个菜单部分，让他也像前面的这一些页面一样使用 gs 去实现。所以到我们的代码区域，按照以前的方法给他添加一个 id， 然后把中间的内容全部删除，在拷贝 gs 里面生成菜单的函数，把它粘贴到 windowso 的的 第一行保存刷新这一个页面，刷新后发现不正常，我们 f 十二进去调试看，发现他不认识这一个函数，说明我们的 gs 没有引进来， 所以我们去引用工友的结实文件，粘贴到 这个位置，再保存，再刷新好了，有了内容的现在这个也是可以使用七 s 来展示了， 但是发现他还没有实现自动登录的功能，所以接下来我们再去把 indix 里面的获取本地信息的这一个函数粘贴到这下面，单击保存，再刷新页面，你会发现他可以自动登录了。 接下来我们希望这个夜头能够全屏展示。在我们制作这个 user free 点 html 的时候，我们给他添加了一个菜单的最大的父亲， 所以我们去定义一下这一个 mailul l 的样式，把它放在这个位置，加上注视全屏画菜单，添加样式宽度百分百，背景颜色 红色 overflow item， 再刷新这一个页面，会发现他的菜单区全屏化了。接下来我们再来调整这一个菜单，让他的上部分跟这一个平齐， 所以我们又要去修改菜单的 css 文件，把 martin top 十个像素把它去掉，保存在刷新页面， 你会发现这个菜单就上去了，这一种模式和京东网站应该是一致的，现在我们所有的页面菜单都是统一的，只是这一个后台管理的菜单上 稍微的要长一点，这样我们就实现了所有的菜单的统一。接下来我们就制作这一个右边区域的内容 好了，谢谢大家的观看。

大家好，我是叶一，这节课为大家讲一讲制定页面内潜入其他表单，他们之间如何交互。比如我为了加快开发速度，直接在制定页面内潜入普通表单，供用户提交数据。先放一个按钮， 再放一个抽屉组件，里面放一个 fm 组件，给他配置好地址，这里要注意一下高度，给他设成百分之百， 不然他就会很窄，这里一定要选择百分比。点击这个按钮，显示出这个组件，让用户提交数据， 所以先复制它的 fire id， 给这个按钮配置，点击四键， 它的作用就是显示这个抽屉组件。 z 点儿美元符号就是一大的组件选择器，加上它的 fire id。 抽屉组件呢，有个修方法，我们直接调用，就是这样，点击这个按钮，这个抽屉组件就会显示用户就可以提交数据了。 这个数据虽然提交成功了，但是我还想实现一个功能，提升用户体验。 数据提交之后，这个抽屉主线让它自动隐藏，这个怎么实现呢？这就涉及到他两个的交互了， 制定页面和这个潜入的页面，他两个是独立的页面，他们有两个独立的 window 对象，他们互不干扰，但是通过一些方法呢，他们可以互相访问，互相控制。 这里我就讲一下潜入表单如何去控制布局页面。这个制定页面的抽屉组件 大家都知道 rise 点美元符号就是一大的组件选择器，我们只要在普通表那里面能拿到制定页面的这个 rise， 就可以对这个制定页面的主件进行操作。这个 rise 怎么拿呢？教大家一个非常简单的方法，把这个 rise 的引用存到页面的 window 对象里面， 把它存到 window 点儿页 e res 这个属性里面。 只要我在普通表单里面拿到他的 window 对象，我就一样可以访问到页面的 z 上下文，就可以控制这个自定义页面。我们要实现的是普通表单提交之后自动关闭自定义页面的 表单里面有一个表单提交后的事件，它可以在表单提交后执行一些代码， 我们只需要在这里面拿到自定义面 window 对象的介意 race 属性，就拿到了自定义页面的 race 上下文儿 e e 认识属性在哪里面？在制定页面内的 window 对象里面。而现在普通表单潜入了制定页面，所以说它的副页面就是制定页面，副页面怎么拿 window 点 parent 我就拿到副页面了， 然后它里面有个 window 对象，通过结构复制我们就取到了 e z 是可以去控制制定页面的这个普通表带没有潜入其他表单，这个 z e z 就不存在， 我们就要判断 eez， 如果存在才执行关闭抽屉组件的这个动作， 把制定页面抽屉组件的背后 id 给复制过来， 执行 high 的方法，仅仅三行代码就实现了交互，大家可以举一反三去实现更多的功能。现在我们去测试一下 他是不是点提交之后这个抽屉主页会自动关闭，是不是很完美，体验也非常好，而且我们的方法是非常简单方便的。这节课到此结束，谢谢大家观看。

今天我们继续讲解动态家长 iphone， 解决 iphone 的高度设置问题。今天讲的方法是一种智能的方法，这种方法呢，它的坑比较多，所以我们已经把它做成了一个函数。 使用这种方法，必须首先学习建立网站的方法，也就是要把我们的这一些代码部署成一个网站， 不俗称网站的方法。 iis 建站的方法我们已经教给大家了。现在我们就到我们这个网站里面去指向我们的视力程序， 然后通过浏览器去访问我们的网站， 转向后台管理业，使用域名的方式去访问，才能应用这一个方法。接下来我们到俱乐部的 uphone 框架里面去找一个翼步加载类。 第七个动态设置 iphone 的宽高。把这一部分代码复制下来，其中很多是注释，代码很短。把它复制下来后，粘贴到自己的 js 区域， 代码不长，大概就七八行代码，他能够动态算出 friend 里面的大小。不用再去每一个页面里面，向上一节课所讲的去设置一个 post message 的方法。下面 我们直接掉这个函数，在这个位置掉这个 iphone， 把这个 iphone 作为参数传递给这一个函数。这个函数可以动态设置 iphone 的高度。 接下来把它复制一份，粘贴到下面，在每一个昂克力克世界都粘贴一份。 最后在函数的末尾第一次加载的时候也粘贴一份，保存它。下面我们来测试一下这一种方法。我们刷新页面，单击购物车页面没有生效。 其原因和上一节课的一次是因为我们设置了右边区 的高度，我们把高度删除，再来刷新页面，你就会发现所有的页面他可以自适应高度了。 我们点首页有高度，购物车页面有高度，发布页面有高度。 再切换肺较短的页面也有高度。所以这一种方案只需要调这一个函数即可。使用动态加载 iphone 的方案，设置 iphone 的高度，可以一劳永逸的解决 iphone 的高度设置问题。 在拷贝的代码里面，代码很短，但其中的注视很多，每一个都描述了你可能会遇到的问题。像这些 代码的位置都是不能变动的，其调用的位置也是不能变动的。好了，这节课就讲到这里，大家下课休息， 下面我们来测试一下这一种方法。我们刷新页面，单击购物车页面没有生效， 其原因应该是有缓存，一旦部署成了网站的形式，他就有很多缓存。

上一节课我们制作了用户管理页面，同时签入了购物车页面、产品发布页面、产品管理页面、订单管理页面以及用户管理首页到项目中。 这节课的目的，当我们单击首页，就要显示这个首页。当我们单击购物车页面，就要把购物车页面迁入到这个页面的购物车的区域。 单机购买的商品页面，就要把产品管理页面迁入到这一个区域。单机购买的商品页面，就要把订单管理页面迁入到购买的商品页面。单机出售的商品页面，就要把产品管理页面迁入到右边区域， 以此类推。要完成这一个功能，我们要学习一个新的 htm 标签，这个 htm 标签叫做 iphone， 我们给这个 iphone 一个名字，叫做导航 iphone 再给他一个 name， 也叫导航 iphone， 这两个名字相同， iphone 要设置名为论的属性，不设置论属性， iphone 会出现一些意想不到的错误。 接下来我们给他设没有滚动条， scrolling 是表示滚动条， no 表示没有滚动条。接下来给他指定网页的名字，这个网页的名字我们首先把它设置为 icon， 就是首页。 接下来我刷新这个页面，大家会发现首页就呈现在这里了，也就是把这一个单独的页面把它迁入到了 ifry 当中。 接下来我把这一个网页的名字改成购物车，再来刷新一下，你会发现这边呈现的是购物车的页面。既然 iphone 有这一个特性，可以修改他的指向， 指向不同的网页文件，我们就可以尝试。在安克利克事件当中，当我单击左边的菜单的时候， 我们就得到这一个 i free 修改他的 src， 以实现单击不同的菜单选项。右边区域显示 是不同的页面的功能，下面我们就来制作这一个功能， 第一次进来的时候默认显示首页。当单击菜单一的时候，我们要得到刚才我们建立的 iphone 元素，修改它的指向， 所以我们第一步要得到 iphone 元素。我们定一个变量，假设叫 iphone 等于 document 获取元素 byid， 刚才我们给了他一个名字叫内务 iphone 得到他后，当单机的时候，我们就不再获取文本了，而是让 iphone 的 src 转向首页， back home 点 htm， 接下来拷贝粘贴到下面所有的菜单，单击事件当中。 把第二个菜单转向购物车。下面我们来测试一下第一个页面，首页，第二个购物车。对了，接下来第三个是购买的商品，那就是订单页面， 我们转一下 order manage 这一个页面。第四个我们转向出售大哥的 manage 页面。 第五个转向发布产品的页面，罗大哥特帕布里奇页面。第六个，第七个暂时留空。下面我刷新这一个页面。 单机购物车显示了购物车的信息，单机购买的商品显示了购买的商品信息，单机出售的商品显示了出售的商品信息。单机发布产品显示了发布产品的信息。 但是大家会发现这个 iphone 的高度是有问题的，这个帕布里希的页面这么短，只显示了这么一点内容，而真正的帕布里希页面有这么长。 所以接下来我们要解决的一个问题是能够自动识别网页的长度，例如他能够识别到这一个网页的长度。当我单机发布产品的时候，这边的长度要能够变成 这一边的长度。当我单击购物车的时候，这个购物车的长度要变成这一个长度，要 iphone 动态识别长度。 iphone 动态识别长度是一个难点，我们将用两种方式去实现它， 一种是采用传递消息的 post message 去实现它，另外一种是使用动态加载 iphone 的方法去实现它。这两种方法都有一定的难度， 两种方法各有优缺点。下节课我们就来介绍他，这节课就上到这里，大家下课休息。