来看看：“画中画”效果――谈Iframe标志的利用

只看该作者 · 发表于 2015-1-16 00:21:22

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有帐号？立即注册

x

更好的控制页面布局。不用多说。
　　纵不雅时下网站，原本网速就有些慢，但是几近每页都要放甚么Banner，栏目图片，版权等一年夜堆相同的器材，固然，出于网站作风一致、告白效应的必要，本无可厚非，可究竟让用户的钱包为这些“粉饰“的器材”日趋消得钱干瘪”了，有无举措，让这些相同的器材一次下载后就不必再下载，而只下载那些内容有变更地区的网页内容呢？
　　谜底很一定：使用Iframe标志！

　　1、Iframe标志的利用

　　提起Iframe，大概你早已将之扔到“被忘记的角落”了，不外，提及其兄弟Frame就不会生疏了。Frame标志即帧标志，我们所说的多帧布局就是在一个扫瞄器窗口中显现多个HTML文件。如今，我们碰到一种很实际的情形：若有一个教程，是一节一节地上，每页开端做一个“上一节“、“下一节“的链接，除每节教程内容分歧以外，页面别的部份内容都是不异的，假如一页一页地做笨页面，这仿佛太让人腻烦了，这时候突发奇想，假如有一种办法让页面别的中央稳定，只将教程做成一页一页的内容页，不含别的内容，在点击高低翻页链接时，只改动教程内容部分，别的坚持稳定，如许，一是省时，另则今后如教程有个安然无恙的变化，也很便利，不致于牵一发而动三军了;更主要的是将那些告白Banner、栏目列表、导航等几近每页的都有的器材只下载一次后就不再下载了。

　　Iframe标志，又叫浮动帧标志，你能够用它将一个HTML文档嵌进在一个HTML中显现。它分歧于Frame标志最年夜的特性即这个标志所援用的HTML文件不是与别的的HTML文件互相自力显现，而是能够间接嵌进在一个HTML文件中，与这个HTML文件内容互相交融，成为一个全体，别的，还能够屡次在一个页面内显现统一内容，而不用反复写内容，一个抽象的比方即“画中画“电视。

　　如今我们谈一下Iframe标志的利用。

　　Iframe标志的利用格局是:

　　<Iframesrc="URL"width="x"height="x"scrolling="[OPTION]"frameborder="x"></iframe>
　　src：文件的路径，既但是HTML文件，也能够是文本、ASP等；
　　width、height："画中画"地区的宽与高；
　　scrolling:当SRC的指定的HTML文件在指定的地区不显不完时，转动选项，假如设置为NO，则不呈现转动条；如为Auto：则主动呈现转动条；如为Yes，则显现;
　　FrameBorder：地区边框的宽度，为了让“画中画“与临近的内容相交融，常设置为0。

好比:

　　<Iframesrc="http://netschool.cpcw.com/homepage"width="250"height="200"scrolling="no"frameborder="0"></iframe>

　　2、父窗体与浮动帧之间的互相把持

　　在剧本言语与工具条理中，包括Iframe的窗口我们称之为父窗体，而浮动帧则称为子窗体，弄清这二者的干系很主要，由于要在父窗体中会见子窗体或相反都必需分明工具条理，才干经由过程程序来会见并把持窗体。

　　1、在父窗体中会见并把持子窗体中的工具

　　在父窗体中，Iframe即子窗体是document工具的一个子工具，能够间接在剧本中会见子窗体中的工具。

　　如今就有一个成绩，即，我们如何来把持这个Iframe，这里必要讲一下Iframe工具。当我们给这个标志设置了ID属性后，便可经由过程文档工具模子DOM对Iframe所含的HTML举行一系列把持。

　　好比在example.htm里嵌进test.htm文件，并把持test.htm里一些标志工具：
　　<Iframesrc="test.htm"id="test"width="250"height="200"scrolling="no"frameborder="0"></iframe>
test.htm文件代码为:
　　<html>
　　　<body>
　　　　<h1id="myH1">hello,myboy</h1>
　　　</body>
　　</html>
　　如我们要改动ID号为myH1的H1标志里的笔墨为hello,mydear，则可用:
　　document.myH1.innerText="hello,mydear"(个中，document可省)
　　在example.htm文件中，Iframe标志工具所指的子窗体与一样平常的DHTML工具模子分歧，对工具会见把持体例一样，就不再赘述。

　　2、在子窗体中会见并把持父窗体中工具

　　在子窗体中我们能够经由过程其parent即父（双亲）工具来会见父窗口中的工具。
　　如example.htm：
　　<html>
　　　<bodyonclick="alert(tt.myH1.innerHTML)">
　　　　<Iframename="tt"src="frame1.htm"width="250"height="200"scrolling="no"frameborder="0"></iframe>
　　　　<h1id="myH2">hello,mywife</h1>
　　　</body>
　　</html>
　　假如要在frame1.htm中会见ID号为myH2中的题目笔墨并将之改成"hello,myfriend"，我们就能够如许写：
　　parent.myH2.innerText="hello,myfriend"
　　这里parent工具就代表以后窗体(example.htm地点窗体)，要在子窗体中会见父窗体中的工具，无一破例都经由过程parent工具来举行。

　　Iframe固然内嵌在另外一个HTML文件中，但它坚持绝对的自力，是一个“自力王国“哟，在单一HTML中的特征一样合用于浮动帧中。

　　试想一下，经由过程Iframe标志，我们可将那些稳定的内容以Iframe来暗示，如许，不用反复写不异的内容，这有点象程序计划中的历程或函数，减省了几烦琐的手工休息！别的，相当主要的是，它使页面的修正更加可行，由于，不用由于版式的调剂而修正每一个页面，你只需修正一个父窗体的版式便可了。

　　有一点要注重，Nestscape扫瞄器不撑持Iframe标志，但在时下IE的世界，这仿佛也无年夜碍，普遍接纳Iframe标志，既为本人(网站)着了想，又为网友节俭了网费，何乐而不为？</p>
可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点的所有页面都会随之发生变动。

只看该作者 · 发表于 2015-1-16 19:59:51

技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

只看该作者 · 发表于 2015-1-18 22:58:47

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

只看该作者 · 发表于 2015-1-27 22:06:11

只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。

只看该作者 · 发表于 2015-2-5 15:44:02

运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环

只看该作者 · 发表于 2015-2-12 20:31:30

Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

只看该作者 · 发表于 2015-3-3 10:50:17

Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。

只看该作者 · 发表于 2015-3-11 10:41:17

技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

只看该作者 · 发表于 2015-3-18 12:44:58

使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

只看该作者 · 发表于 2015-3-26 04:18:50

所见则所得网页编辑器的优点就是直观性，使用方便，容易上手.

		自动登录	找回密码
密码			立即注册

[DIV+CSS] 来看看：“画中画”效果――谈Iframe标志的利用

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

相关帖子

来看看：“画中画”效果――谈Iframe标志的利用