使用iframe制作页面框架

最近，公司需要些一个静态页面demo，由于头部、尾部基本统一，为方便修改，所以使用iframe来做嵌套。

记下几个要点：

1、iframe主体部分：

 <iframe id="iframe" name="iframe" src="index.html" οnlοad="autoResize()" scrolling="no"
frameborder="0" style="width:1000px;height:100%; margin-bottom: 20px"></iframe>

设置宽、高和name值。

2、a标签设置：

<li class="on"><a href="index.html" target="iframe">我的账户</a></li>

target 需设置为iframe的name值。

3、使用自动适应高度，加入如下js方法：

function autoResize() {try{document.all["iframe"].style.height = iframe.document.body.clientHeight;}catch(e){}
}

scrollHeight：

在火狐，就是滚动条可滚动的部分还要加上boder的高度还要加上横向滚动条不可用的高度，与clientHeight比起来，多了个border的高度跟横向滚动条不可用的高度。

在IE中，指这个对象它所包含的对象的高度加上boder的高度和marging，如果它里面没有包含对象或者这个对象的高度值未设置，那么它的值将为15。

clientHeight：可见区域的宽度，不包括boder的宽度,如果区域内带有滚动条，还应该减去横向滚动条不可用的高度。

offsetHeight：表示是自身的高度，如果有设置boder的话还应该加上boder的值。

如此便能把制作好的子页面直接嵌套进去iframe里面了。

使用iframe制作页面框架相关推荐

html网页制作浮动框架,浮动框架在网页制作中使用技巧.doc
浮动框架在网页制作中使用技巧浮动框架在网页制作中使用技巧摘要:首先介绍了浮动框架的应用特点,然后结合实际的使用技巧介绍了在浮动框架中:可以制作与其它页面之间的链接,设置浮动框架的滚动条及区域的颜色, ...
iframe内嵌框架自适应高度
添加js代码: /iframe内嵌框架自适应高度/ function iFrameHeight() { var ifm= document.getElementById("iframepag ...
结构化元素、网页结构和iframe内联框架
1.结构化元素 <header> //表示网页的头部 <footer> //表示网页的尾部 <section> //表示网页的独立区域 <article> ...
axure RP文件如何找回_AXURE教程：管理后台页面框架
今天,教大家如何用AXURE做一个管理后台页面框架. 本文以员工信息为案例,展示中继器增.删.改.查+导入+导出+排序的真实效果.包括直接在中继器修改和弹出页面修改两种模式,只需要导入数据,就可以直接 ...
js页面跳转和js对iframe进行页面跳转、刷新
js页面跳转和js对iframe进行页面跳转.刷新一.js方式的页面跳转 1.window.location.href方式 <script language="javascr ...
iframe与主框架跨域相互访问方法
iframe 与主框架相互访问方法 1.同域相互访问假设A.html 与 b.html domain都是localhost (同域) A.html中iframe 嵌入 B.html,name=myf ...
原型设计如何直接生成html,使用原型设计工具 Axure RP创建一个web页面框架
前言什么是原型呢? 原型设计是交互设计师与PD.PM.网站开发工程师沟通的最好工具.而该块的设计在原则上必须是交互设计师的产物,交互设计以用户为中心的理念会贯穿整个产品.利用交互设计师专业的眼光与经 ...
iframe子页面position的fixed
前言: 首先说一说我昨天天的苦逼经历.中午吃饭时一同事跟我说,他做的项目嵌套iframe后,子页面的position设置fixed失效了. 经过反复询问,得知他用了两层iframe,再加上最外的父页面 ...
iframe和iframe实现页面内嵌套一个页面（jsp）
相信刚学习javaweb的同学都十分好奇页面上点击一个按钮下面就显示一个页面,点击不同的导航栏按钮,下方就会显示不同内容,这就用到了iframe标签的src属性.下面就给大家介绍一下iframe的使用 ...

使用iframe制作页面框架

使用iframe制作页面框架相关推荐

最新文章

热门文章