首页技术iframe透明(怎么让iframe背景变透明 )

iframe透明(怎么让iframe背景变透明 )

编程之家2024-01-29133次浏览

一、iframe 属性

iframe元素的功能是在一个html内嵌一个文档,创建一个浮动的帧。iframe可以嵌在网页中的任意部分

iframe透明(怎么让iframe背景变透明 )

name:内嵌帧名称

width:内嵌帧宽度(可用像素值或百分比)

height:内嵌帧高度(可用像素值或百分比)

frameborder:内嵌帧边框

marginwidth:帧内文本的左右页边距

marginheight:帧内文本的上下页边距

iframe透明(怎么让iframe背景变透明 )

scrolling:是否出现滚动条(“auto”为自动,“yes”为显示,“no”为不显示)

src:内嵌入文件的地址

style:内嵌文档的样式(如设置文档背景等)

allowtransparency:是否允许透明

iframe还有一个很有用的用法:强调页面的某项内容

先把要强调显示的内容另存为一个文件,如first.htm,然后通过一个预载页index.htm,内容如下:

iframe透明(怎么让iframe背景变透明 )

〈meta http-equiv="refresh" content="3,url=index2.htm"〉

〈body〉

页面加载中,请稍候……〈iframe src="first.htm" style="display:none"〉〈/iframe〉

〈/body〉

主文件index2.htm

〈body〉

〈iframe src="first.htm"加入其他属性限制〉〈/iframe〉

〈/body〉

解释成“浏览器中的浏览器“很是恰当

<iframe frameborder=0 width=170 height=100 marginheight=0 marginwidth=0 scrolling=no src="move-ad.htm"></iframe>

<IFRAME>用于设置文本或图形的浮动图文框或容器。

BORDER

<IFRAME BORDER="3"></IFRAME>

设定围绕图文框的边缘宽度

FRAMEBODER

<IFRAME FRAMEBODER="0"></IFRAME>

设置边框是不否为3维(0=否,1=是)

HEIGHT,WIDTH

<IFRAME HEIGHT="31" WIDTH="88"></IFRAME>

设质边框的宽度和高度

SCROLLING

<IFRAME SCROLLING="NO"></IFRAME>

是否有滚动条(YES,NO,AUTO)

SRC

<IFRAME SRC="GIRL.GIF"></IFRAME>

指定IFRAME调用的文件或图片(HTML,HTM,GIF,JPEG,JPG,PNG,TXT,*.*)

-------------------------------------------------------------

“画中画”效果--谈IFRAME标签的使用

纵观时下网站,本来网速就有些慢,可是几乎每页都要放什么Banner,栏目图片,版权等一大堆雷同的东西,当然,出于网站风格统一、广告效应的需要,本无可厚非,可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了,有没有办法,让这些雷同的东西一次下载后就不用再下载,而只下载那些内容有变化区域的网页内容呢?

答案很肯定:应用Iframe标记!

一、Iframe标记的使用

提起Iframe,可能你早已将之扔到“被遗忘的角落”了,不过,说起其兄弟Frame就不会陌生了。Frame标记即帧标记,我们所说的多帧结构就是在一个浏览器窗口中显示多个HTML文件。现在,我们遇到一种很现实的情况:如有一个教程,是一节一节地上,每页末尾做一个“上一节“、“下一节“的链接,除了每节教程内容不同之外,页面其它部分内容都是相同的,如果一页一页地做笨页面,这似乎太让人厌烦了,这时突发奇想,如果有一种方法让页面其它地方不变,只将教程做成一页一页的内容页,不含其它内容,在点击上下翻页链接时,只改变教程内容部分,其它保持不变,这样,一是省时,另则以后如教程有个三长两短的变动,也很方便,不致于牵一发而动全军了;更重要的是将那些广告Banner、栏目列表、导航等几乎每页的都有的东西只下载一次后就不再下载了。 Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。

现在我们谈一下Iframe标记的使用。

Iframe标记的使用格式是:

<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>

src:文件的路径,既可是HTML文件,也可以是文本、ASP等;

width、height:"画中画"区域的宽与高;

scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示;

FrameBorder:区域边框的宽度,为了让“画中画“与邻近的内容相融合,常设置为0。

比如:

<Iframe src="";; width="250" height="200" scrolling="no" frameborder="0"></iframe>

二、父窗体与浮动帧之间的相互控制在脚本语言与对象层次中,包含Iframe的窗口我们称之为父窗体,而浮动帧则称为子窗体,弄清这两者的关系很重要,因为要在父窗体中访问子窗体或相反都必须清楚对象层次,才能通过程序来访问并控制窗体。

1、在父窗体中访问并控制子窗体中的对象

在父窗体中,Iframe即子窗体是document对象的一个子对象,可以直接在脚本中访问子窗体中的对象。

现在就有一个问题,即,我们怎样来控制这个Iframe,这里需要讲一下Iframe对象。当我们给这个标记设置了ID属性后,就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。

比如在example.htm里嵌入test.htm文件,并控制test.htm里一些标记对象:

<Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>

test.htm文件代码为:

<html>

<body>

<h1 id="myH1">hello,my boy</h1>

</body>

</html>

如我们要改变ID号为myH1的H1标记里的文字为hello,my dear,则可用:

document.myH1.innerText="hello,my dear"(其中,document可省)

在example.htm文件中,Iframe标记对象所指的子窗体与一般的DHTML对象模型一致,对对象访问控制方式一样,就不再赘述。

2、在子窗体中访问并控制父窗体中对象

在子窗体中我们可以通过其parent即父(双亲)对象来访问父窗口中的对象。

如example.htm:

<html>

<body onclick="alert(tt.myH1.innerHTML)">

<Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>

<h1 id="myH2">hello,my wife</h1>

</body>

</html>

如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend",我们就可以这样写:

parent.myH2.innerText="hello,my friend"

这里parent对象就代表当前窗体(example.htm所在窗体),要在子窗体中访问父窗体中的对象,无一例外都通过parent对象来进行。

Iframe虽然内嵌在另一个HTML文件中,但它保持相对的独立,是一个“独立王国“哟,在单一HTML中的特性同样适用于浮动帧中。

试想一下,通过Iframe标记,我们可将那些不变的内容以Iframe来表示,这样,不必重复写相同的内容,这有点象程序设计中的过程或函数,减省了多少繁琐的手工劳动!另外,至关重要的是,它使页面的修改更为可行,因为,不必因为版式的调整而修改每个页面,你只需修改一个父窗体的版式即可了。

有一点要注意,Nestscape浏览器不支持Iframe标记,但在时下IE的天下,这似乎也无大碍,广泛采用Iframe标记,既为自己(网站)着了想,又为网友节省了网费,何乐而不为?

例子:

<iframe src="页面" width="宽度" height="高度" align="排列可以是left或right,center" scrolling="是否有滚动条可以填no或yes"></iframe>

<IFRAME frameBorder=0 frameSpacing=0 height=25 marginHeight=0 marginWidth=0 scrolling=no name=main src="bgm/bgm.html" width=300></IFRAME>

2:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

用了iframe后发现滚动条不漂亮想用2个图片来代替↑↓

应该怎么实现呢?

回答:

用下列代码替换网页的<title>..</title>

<SCRIPT LANGUAGE="javascript">

function scroll(n)

{temp=n;

Out1.scrollTop=Out1.scrollTop+temp;

if(temp==0) return;

setTimeout("scroll(temp)",80);

}

</SCRIPT>

<TABLE WIDTH="330">

<TR>

<TD WIDTH="304" VALIGN="TOP" ROWSPAN="2">

<DIV ID=Out1 STYLE="width:100%; height:100;overflow: hidden;border-style:dashed;border-width: 1px,1px,1px,1px;">

文字<BR>文字<BR>

文字<BR>

文字<BR>

文字

<BR>

<BR>

</DIV>

</TD>

<TD WIDTH="14" VALIGN="TOP"><IMG SRC="photo/up0605.gif" WIDTH="14" HEIGHT="20" onmouseover="scroll(-1)" onmouseout="scroll(0)" onmousedown="scroll(-3)" BORDER="0" ALT="按下鼠标速度会更快!"></TD>

</TR>

<TR>

<TD WIDTH="14" VALIGN="BOTTOM"><IMG SRC="photo/down0605.gif" onmouseover="scroll(1)" onmouseout="scroll(0)" onmousedown="scroll(3)" BORDER="0" WIDTH="15" HEIGHT="21" ALT="按下鼠标速度会更快!"></TD>

</TR>

</TABLE>

内框架Iframe的使用

使用Iframe可以在一人表格内调用一个外部文件,是非常有用的。本网站在很多页面上都使用了iframe效果。

现在我们学一下Iframe标记的使用。

Iframe标记的使用格式是:

<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x" name="main"></iframe>

src:文件的路径,既可是HTML文件,也可以是文本、ASP等;

width、height:"内部框架"区域的宽与高;

scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示;

FrameBorder:区域边框的宽度,为了让“内部框架“与邻近的内容相融合,常设置为0。

name:框架的名字,用来进行识别。

比如:

<Iframe src="" width="250" height="200" scrolling="Auto" frameborder="0" name="main"></iframe>

当你想用父框架控制内部框架时,可以使用: target="框架的名字"来控制。

Dreamweaver MX进阶教程(一)可视化操作iframe

iframe也称作嵌入式框架,嵌入式框架和框架网页类似,它可以把一个网页的框架和内容嵌入在现有的网页中。

从Dreamweaver MX开始,可以可视化操作iframe,不再需要第三方插件。

插入iframe

1.点击“插入面板”的“标签选择器”

.在“标签选择器”对话框中,选择iframe标签,点击“插入”按钮。

.在“标签编辑器-Iframe”对话框中,根据面板提示操作。最基本的两项是“源”和“名称”。

源:点击“浏览”按钮,选择要出现在iframe中的网页文件。

名称:输入的名称,将作为这个iframe的标识,其它的链接如果要在这个iframe打开,网页打开“目标”就需要输入此“名称”。

宽度和高度:可以输入象素值,也可以输入100%。

边距宽度和边距高度:设置和外围标签的边距。

对齐:设置对齐方式。

滚动:设置是否允许出现滚动条。

显示边框:选择是否出现边框。

设置链接在某个iframe中打开

选中链接,在属性面板中的“目标”项,手工输入目标iframe的“名称”。

iframe透明

为了使iframe内容和网页背景相同,需要使iframe透明。

在“标签编辑器-Iframe”对话框中,选择“浏览器特定的”项目卡,选中“允许透明”。

框架包含应用程序

在“标签编辑器-Iframe”对话框中,选择“浏览器特定的”项目卡,选中“框架包含应用程序”。

Iframe的替代内容

在某些不支持iframe的浏览器中,iframe将不能显示。这时需要输入替代内容。

在“标签编辑器-Iframe”对话框中,选择“替代内容”选项,在替代内容中输入代码或者文字。

二、iframe 里的表格被缩放的问题

IFRAME元素| iframe对象

--------------------------------------------------------------------------------

创建内嵌浮动框架。

成员表

下面的表格列出了 iframe对象引出的成员。请单击左侧的标签来选择你想要查看的成员类型。

标签属性/属性

SHOW:

标签属性/属性

行为

集合

事件

滤镜

方法

对象

样式

标签属性属性描述

ALIGN align设置或获取表格排列。

ALLOWTRANSPARENCY allowTransparency设置或获取对象是否可为透明。

APPLICATION APPLICATION表明对象的内容是否为 HTML应用程序(HTA),以便免除浏览器安全模式。

ATOMICSELECTION指定元素及其内容是否可以一不可见单位统一选择。

BEGIN begin设置或获取时间线在该元素上播放前的延迟时间。

BORDER border设置或获取框架间的空间,包括 3D边框。

canHaveChildren获取表明对象是否可以包含子对象的值。

canHaveHTML获取表明对象是否可以包含丰富的 HTML标签的值。

CLASS className设置或获取对象的类。

contentWindow获取指定的 frame或 iframe的 window对象。

DATAFLD dataFld设置或获取由 dataSrc属性指定的绑定到指定对象的给定数据源的字段。

DATASRC dataSrc设置或获取用于数据绑定的数据源。

disabled获取表明用户是否可与该对象交互的值。

END end设置或获取表明元素结束时间的值,或者元素设置为重复的简单持续终止时间。

firstChild获取对象的 childNodes集合的第一个子对象的引用。

FRAMEBORDER frameBorder设置或获取是否显示框架的边框。

hasMedia获取一个表明元素是否为 HTML+TIME媒体元素的 Boolean值。

HEIGHT height设置或获取对象的高度。

HIDEFOCUS hideFocus设置或获取表明对象是否显式标明焦点的值。

HSPACE hspace设置或获取对象的水平边距。

ID id获取标识对象的字符串。

innerText设置或获取位于对象起始和结束标签内的文本。

isContentEditable获取表明用户是否可编辑对象内容的值。

isDisabled获取表明用户是否可与该对象交互的值。

isMultiLine获取表明对象的内容是包含一行还是多行的值。

isTextEdit获取是否可使用该对象创建一个 TextRange对象。

LANG lang设置或获取要使用的语言。

LANGUAGE language设置或获取当前脚本编写用的语言。

lastChild获取该对象 childNodes集合中最后一个子对象的引用。

longDesc设置或获取对象长描述的统一资源标识符(URI)。

MARGINHEIGHT marginHeight设置或获取显示框架中文本之前的上下边距高度。

MARGINWIDTH marginWidth设置或获取显示框架中文本之前的左右边距宽度。

NAME name设置或获取框架的名称。

nextSibling获取对此对象的下一个兄弟对象的引用。

nodeName获取特定结点类型的名称。

nodeType获取所需结点的类型。

nodeValue设置或获取结点的值。

offsetHeight获取对象相对于版面或由父坐标 offsetParent属性指定的父坐标的高度。

offsetLeft获取对象相对于版面或由 offsetParent属性指定的父坐标的计算左侧位置。

offsetParent获取定义对象 offsetTop和 offsetLeft属性的容器对象的引用。

offsetTop获取对象相对于版面或由 offsetTop属性指定的父坐标的计算顶端位置。

offsetWidth获取对象相对于版面或由父坐标 offsetParent属性指定的父坐标的宽度。

onOffBehavior获取表明指定的 Microsoft® DirectAnimation®行为是否正在运行的对象。

outerHTML设置或获取对象及其内容的 HTML形式。

outerText设置或获取对象的文本。

ownerDocument设置或获取结点关联的 document对象。

parentElement获取对象层次中的父对象。

parentNode获取文档层次中的父对象。

parentTextEdit获取文档层次中可用于创建包含原始对象的 TextRange的容器对象。

previousSibling获取对此对象的上一个兄弟对象的引用。

readyState获取对象的当前状态。

readyState获取表明对象当前状态的值。

recordNumber获取数据集中生成对象的原始记录。

scopeName获取为该元素定义的命名空间。

SCROLLING scrolling设置或获取框架是否可被滚动。

SECURITY SECURITY获取表明 frame或 iframe的源文件是否应用了特定的安全限制的值。

sourceIndex获取对象在源序中的依次位置,即对象出现在 document的 all集合中的顺序。

SRC src设置或获取要由对象装入的 URL。

STYLE为该设置元素设置内嵌样式。

SYNCMASTER syncMaster设置或获取时间容器是否必须在此元素上同步回放。

SYSTEMBITRATE获取系统中大约可用带宽的 bps。

SYSTEMCAPTION表明是否要显示文本来代替演示的的音频部分。

SYSTEMLANGUAGE表明是否在用户计算机上的选项设置中选中了给定语言。

SYSTEMOVERDUBORSUBTITLE指定针对那些正在观看演示但对被播放的音频所使用的语言并不熟悉的用户来说是否要渲染配音或字幕。

TABINDEX tabIndex设置或获取定义对象的 Tab顺序的索引。

tagName获取对象的标签名称。

tagUrn设置或获取在命名空间声明中指定的统一资源名称(URN)。

TIMECONTAINER timeContainer设置或获取与元素关联的时间线类型。

TITLE title设置或获取对象的咨询信息(工具提示)。

uniqueID获取为对象自动生成的唯一标识符。

UNSELECTABLE指定该元素不可被选中。

VSPACE vspace设置或获取对象的垂直边距。

WIDTH width设置或获取对象的宽度。

标签属性/属性

行为

行为描述

clientCaps提供关于 Internet Explorer支持的特性的信息,以及提供即用即装的方法。

download下载文件并在下载完成后通知一个指定的回调函数。

homePage包含关于用户主页的信息。

time为 HTML元素提供一个活动的时间线。

time2为 HTML元素或一组元素提供一个活动的时间线。

集合

集合描述

all返回对象所包含的元素集合的引用。

attributes获取对象标签属性的集合。

behaviorUrns返回标识附加到该元素行为的统一资源名称(URN)字符串的集合。

childNodes获取作为指定对象直接后代的 HTML元素和 TextNode对象的集合。

children获取作为对象直接后代的 DHTML对象的集合。

事件

事件描述

onactivate当对象设置为活动元素时触发。

onafterupdate当成功更新数据源对象中的关联对象后在数据绑定对象上触发。

onbeforedeactivate在 activeElement从当前对象变为父文档其它对象之前立即触发。

onbeforeupdate当成功更新数据源对象中的关联对象前在数据绑定对象上触发。

onblur在对象失去输入焦点时触发。

oncontrolselect当用户将要对该对象制作一个控件选中区时触发。

ondeactivate当 activeElement从当前对象变为父文档其它对象时触发。

onerrorupdate更新数据源对象中的关联数据出错时在数据绑定对象上触发。

onfocus当对象获得焦点时触发。

onload在浏览器完成对象的装载后立即触发。

onmove当对象移动时触发。

onmoveend当对象停止移动时触发。

onmovestart当对象开始移动时触发。

onreadystatechange当对象状态变更时触发。

onresizeend当用户更改完控件选中区中对象的尺寸时触发。

onresizestart当用户开始更改控件选中区中对象的尺寸时触发。

ontimeerror当特定时间错误发生时无条件触发,通常由将属性设置为无效值导致。

滤镜

滤镜属性描述

Alpha调整对象内容的不透明度。

AlphaImageLoader在对象的边界和对象背景到内容之间显示图像,可选剪裁或缩放图像大小。当装入便携网络图像(PNG)时,从 0到 100%的透明度都是支持的。

Barn以开门或关门的运动方式显示对象的新内容。

BasicImage调整对象内容的颜色处理、图像旋转或不透明度。

BlendTrans以渐隐原始内容的形式显示对象的新内容。

Blinds以打开或关闭盲点的运动方式显示对象的新内容。

Blur模糊对象的内容以便使其看起来失去焦点。

CheckerBoard以揭开覆盖在原始内容上的棋盘的形式显示对象的新内容。

Chroma将对象内容的指定颜色显示为透明。

Compositor以新旧内容逻辑颜色组合的形式显示对象的新内容。每个版本的颜色和 alpha值都会被计算用来决定输出图像的最终颜色。

DropShadow创建对象内容的实体阴影,偏移量位于指定方向。这将使得内容看起来是浮动的因此会产生阴影。

Emboss使用灰度值对对象以浮雕纹理显示。

Engrave使用灰度值对对象以雕刻纹理显示。

Fade以渐隐原始内容的形式显示对象的新内容。

FlipH以沿水平方向翻转的形式显示对象内容。

FlipV以沿垂直方向翻转的形式显示对象内容。

Glow在对象边缘外侧添加光晕以便使其看起来像发光的样子。

Gradient在对象的背景和内容之间显示一个渐变色彩的表面。

GradientWipe以在原有内容上覆盖渐变带的形式显示对象的新内容。

Gray以灰度显示对象内容。

ICMFilter根据图像颜色管理(ICM)配置文件转换对象的彩色内容。这将允许指定内容的显示效果得以改善,或者在打印机或监视器等硬件设备上模拟显示。

Inset以对角线方向显示对象的新内容。

Invert反转对象内容的色调、饱和度和亮度。

Iris以彩虹效果显示对象的新内容,这与照相机光圈打开相似。

Light在对象的内容上创建灯光效果。

MaskFilter将对象内容的透明像素显示为彩色遮罩,将非透明像素显示为透明。

Matrix使用矩阵变换缩放、旋转或显现对象的内容。

MotionBlur以运动模糊的效果显示对象内容。

Pixelate将对象的内容显示为彩色方块,其颜色取决于该方块所替代区域的平均颜色值。此滤镜显示可用于切换。

RadialWipe以辐射状擦除的形式显现对象的新内容。

RandomBars以随机像素线爆炸的形式显现对象的新内容。

RandomDissolve以随机像素爆炸的形式显现对象的新内容。

Redirect目前还不支持。

RevealTrans使用 24种预先定义的切换效果显现对象的新内容。

Shadow创建对象内容的实体阴影,偏移量位于指定方向。这将创建阴影效果。

Slide以图像滑行的形式显现对象的新内容。

Spiral以螺旋运动的形式显现对象的新内容。

Stretch以拉伸覆盖原始内容的形式显现对象的新内容。有一个选项类似立方体从一个表面转到另外一个表面。

Strips以条形覆盖的形式显现对象的原始内容,好像有一把锯将原始内容锯开。

Wave在对象的内容上执行垂直方向的正弦波扭曲。

Wheel以旋转运动的形式显现对象的新内容,好像轮子滚过原始内容。

Xray更改对象内容的颜色深度将其以黑白显示。

Zigzag在对象上将对象的新内容进行来回移动以便覆盖原始内容。

方法

方法描述

addBehavior给元素附加一个行为。

appendChild给对象追加一个子元素。

applyElement使得元素成为其它元素的子元素或父元素。

attachEvent将指定函数绑定到事件,以便每当该事件在对象上触发时都调用该函数。

blur使元素失去焦点并触发 onblur事件。

clearAttributes从对象中删除全部标签属性和值。

cloneNode从文档层次中复制对对象的引用。

componentFromPoint通过特定事件返回对象在指定坐标下的位置。

contains检查对象中是否包含给定元素。

detachEvent从事件中取消指定函数的绑定,这样当事件触发时函数就不会收到通知了。

dragDrop初始化拖曳事件。

fireEvent触发对象的指定事件。

focus使得元素得到焦点并执行由 onfocus事件指定的代码。

getAdjacentText返回邻接文本字符串。

getAttribute获取指定标签属性的值。

getAttributeNode获取由 attribute.name属性引用的 attribute对象。

getElementsByTagName获取基于指定元素名称的对象集合。

getExpression获取给定属性的表达式。

hasChildNodes返回表明对象是否有子对象的值。

insertAdjacentElement在指定位置插入元素。

insertAdjacentHTML在指定位置的元素中插入给定的 HTML文本。

insertAdjacentText在指定位置插入给定的文本。

insertBefore在文档层次中插入元素作为父对象的子结点。

mergeAttributes复制所有读/写标签属性到指定元素。

normalize合并邻接 TextNode对象以便生成一个常规的文档对象模型。

removeAttribute删除对象的给定标签属性。

removeAttributeNode从对象中删除删除 attribute对象。

removeBehavior分离元素的行为。

removeChild从元素上删除子结点。

removeExpression从指定属性中删除表达式。

removeNode从文档层次中删除对象。

replaceAdjacentText替换元素的邻接文本。

replaceChild用新的子元素替换已有的子元素。

replaceNode用其它元素替换对象。

scrollIntoView将对象滚动到可见范围内,将其排列到窗口顶部或底部。

setActive设置对象为当前对象而不将对象置为焦点。

setAttribute设置指定标签属性的值。

setAttributeNode设置 attribute对象为对象的一部分。

setExpression设置指定对象的表达式。

swapNode交换文档层次中两个对象的位置。

对象

对象描述

runtimeStyle代表了居于全局样式表、内嵌样式和 HTML标签属性指定的格式和样式之上的对象的格式和样式。

style代表了给定元素所有可能的内嵌样式的当前设置。

样式

样式标签属性样式属性描述

ACCELERATOR accelerator设置或获取表明对象是否包含快捷键的字符串。

background-attachment backgroundAttachment设置或获取背景图像如何附加到文档内的对象中。

background-color backgroundColor设置或获取对象内容后的颜色。

background-position-x backgroundPositionX设置或获取 backgroundPosition属性的 x坐标。

background-position-y backgroundPositionY设置或获取 backgroundPosition属性的 y坐标。

behavior behavior设置或获取 DHTML行为的位置。

border-bottom borderBottom设置或获取对象下边框的属性。

border-bottom-color borderBottomColor设置或获取对象下边框的颜色。

border-bottom-style borderBottomStyle设置或获取对象下边框的样式。

border-bottom-width borderBottomWidth设置或获取对象下边框的宽度。

border-color borderColor设置或获取对象的边框颜色。

border-left borderLeft设置或获取对象左边框的属性。

border-left-color borderLeftColor设置或获取对象左边框的颜色。

border-left-style borderLeftStyle设置或获取对象左边框的样式。

border-left-width borderLeftWidth设置或获取对象左边框的宽度。

border-right borderRight设置或获取对象右边框的属性。

border-right-color borderRightColor设置或获取对象右边框的颜色。

border-right-style borderRightStyle设置或获取对象右边框的样式。

border-right-width borderRightWidth设置或获取对象右边框的宽度。

border-style borderStyle设置或获取对象上下左右边框的样式。

border-top borderTop设置或获取对象上边框的属性。

border-top-color borderTopColor设置或获取对象上边框的颜色。

border-top-style borderTopStyle设置或获取对象上边框的样式。

border-top-width borderTopWidth设置或获取对象上边框的宽度。

border-width borderWidth设置或获取对象上下左右边框的宽度。

bottom bottom设置或获取对象相对于文档层次中下个定位对象的底部的位置。

clear clear设置或获取对象是否允许在其左侧、右侧或两边放置浮动对象,以防下段文本显示在浮动对象上。

clip clip设置或获取定位对象的哪个部分可见。

cursor cursor设置或获取当鼠标指针指向对象时所使用的鼠标指针。

display display设置或获取对象是否要渲染。

filter filter设置或获取应用于对象的滤镜或滤镜集合。

height height设置或获取对象的高度。

layout-grid layoutGrid设置或获取指定文本字符版面的组合文档格线属性。

layout-grid-mode layoutGridMode设置或获取文本布局网格是否使用二维。

left left设置或获取对象相对于文档层次中下个定位对象的左边界的位置。

margin margin设置或获取对象的上下左右边距。

margin-bottom marginBottom设置或获取对象的下边距宽度。

margin-left marginLeft设置或获取对象的左边距宽度。

margin-right marginRight设置或获取对象的右边距宽度。

margin-top marginTop设置或获取对象的上边距宽度。

overflow-x overflowX设置或获取当内容超出对象宽度时如何管理对象内容。

overflow-y overflowY设置或获取当内容超出对象高度时如何管理对象内容。

pixelBottom设置或获取对象的下方位置。

pixelHeight设置或获取对象的高度。

pixelLeft设置或获取对象的左侧位置。

pixelRight设置或获取对象的右侧位置。

pixelTop设置或获取对象的上方位置。

pixelWidth设置或获取对象的宽度。

posBottom设置或获取以 bottom标签属性指定的单位的对象下方位置。

posHeight设置或获取以 height标签属性指定的单位的对象高度。

position position设置或获取对象所使用的定位方式。

posLeft设置或获取以 left标签属性指定的单位的对象左侧位置。

posRight设置或获取以 right标签属性指定的单位的对象右侧位置。

posTop设置或获取以 top标签属性指定的单位的对象上方位置。

posWidth设置或获取以 width标签属性指定的单位的对象宽度。

right right设置或获取对象相对于文档层次中下个已定位的对象的右边界的位置。

float styleFloat设置或获取文本要绕排到对象的哪一侧。

text-autospace textAutospace设置或获取自动留空和文本的窄空间宽度调整。

top top设置或获取对象相对于文档层次中下个定位对象的上边界的位置。

visibility visibility设置或获取对象的内容是否显示。

z-index zIndex设置或获取定位对象的堆叠次序。

zoom zoom设置或获取对象的放大比例。

注释

IFRAME元素也就是文档中的文档,或者好像浮动的框架(FRAME)。frames集合提供了对 IFRAME内容的访问。请使用 frames集合读写 IFRAME内包含的元素。例如,如果要访问 iframe内 body对象的 backgroundColor样式,语法应为:

sColor= document.frames("sFrameName").document.body.style.backgroundColor;

通过 iframe对象所在页面的对象模型,你可以访问 iframe对象的属性,但不能访问其内容。例如,访问 iframe对象的 border样式的语法应为:

sBorderValue= document.all.oFrame.style.border;

注意 iframe的属性必须使用前缀 document.all访问,例如 document.all.iframeId.marginWidth。

Internet Explorer 5.5支持浮动框架的内容透明。如果想要为浮动框架定义透明内容,则必须满足下列条件。

与 IFRAME元素一起使用的 ALLOWTRANSPARENCY标签属性必须设置为 true。

在 IFRAME内容源文档,background-color或 BODY元素的 BGCOLOR标签属性必须设置为 transparent。

参看使用透明的浮动框架可以获得关于透明浮动框架更多的信息。

此元素在 Microsoft® Internet Explorer 4.0的 HTML和脚本中可用。

此元素是一个块元素。

此元素需要关闭标签。

示例

下面的例子使用了 IFRAME元素创建了包含页面 sample.htm的框架。

下面的例子返回了对 IFRAME包含的文档的 all集合的引用。

var collAll= document.frames("IFrame1").document.all

三、如何隐藏显示iframe

下面是隐藏显示的代码:

index.

<>

<head>

<meta HTTP-EQUIV="Content-Type" CONTENT="text/; charset=gb2312">

<meta name=GENERATOR content="Microsoft FrontPage 4.0">

<meta name=ProgId content="FrontPage.Editor.Document">

<title>frame框架的显示隐藏操作- 51windows</title>

</head>

<frameset name=full rows="64,*,64">

<frame name=top scrolling="no" xnoresize target="contents" src=top.>

<frameset cols="25%,*" name=cen>

<frame name=contents target="main" src=left.>

<frame name=main src=main.>

</frameset>

<frame name=bottom scrolling="no" xnoresize target="contents" src=bottom.>

<noframes>

<body>

<p>此网页使用了框架,但您的浏览器不支持框架。

</p>

</body>

</noframes>

</frameset>

</>

main.

<>

<head>

<meta-equiv="Content-Type" content="text/; charset=gb2312">

<meta name=GENERATOR content="Microsoft FrontPage 4.0">

<meta name=ProgId content="FrontPage.Editor.Document">

<title>main- 51windows</title>

</head>

<body>

<SCRIPT LANGUAGE="javascript">

<!--

function shtop{

if(parent.full.rows.indexOf("0,*,")!=-1){

parent.full.rows="64,*,"+parent.full.rows.split(",")[2]

document.getElementById("shtop").value="隐藏上部";

}

else{

parent.full.rows="0,*,"+parent.full.rows.split(",")[2]

document.getElementById("shtop").value="显示上部";

}

}

function shleft{

if(parent.cen.cols=="0,*"){

parent.cen.cols="25%,*,"

document.getElementById("shleft").value="隐藏左部";

}

else{

parent.cen.cols="0,*"

document.getElementById("shleft").value="显示左部";

}

}

function shbottom{

if(parent.full.rows.indexOf(",*,0")!=-1){

parent.full.rows=parent.full.rows.split(",")[0]+",*,64"

document.getElementById("shbottom").value="隐藏下部";

}

else{

parent.full.rows=parent.full.rows.split(",")[0]+",*,0"

document.getElementById("shbottom").value="显示下部";

}

}

function maxmain{

if(parent.full.rows=="0,*,0"){

parent.full.rows="64,*,64"

parent.cen.cols="25%,*"

document.getElementById("maxmain").value="隐藏左上下";

document.getElementById("shtop").value="隐藏上部";

document.getElementById("shleft").value="隐藏左部";

document.getElementById("shbottom").value="隐藏下部";

}

else{

parent.full.rows="0,*,0";

parent.cen.cols="0,*";

document.getElementById("maxmain").value="显示左上下";

document.getElementById("shtop").value="显示上部";

document.getElementById("shleft").value="显示左部";

document.getElementById("shbottom").value="显示下部";

}

}

//-->

</SCRIPT>

<input type=button name=maxmain id="maxmain" onclick="maxmain;" value="隐藏左上下">

<input type=button name=shtop id="shtop" onclick="shtop;" value="隐藏上部">

<input type=button name=shleft id="shleft" onclick="shleft;" value="隐藏左部">

<input type=button name=shbottom id="shbottom" onclick="shbottom;" value="隐藏下部">

</body>

</>

框架的嵌套:

<>

<head>

</head>

<body>

<iframe width=468 height=60 src=abc.aspx></iframe>

<iframe width=468 height=60 src=cde.aspx></iframe>

</body>

</>

#################################################

<>

<head>

<meta-equiv="content-type" content="text/; charset=gb2312">

<title>无标题文档</title>

</head>

<frameset rows="77,181" cols="*" framespacing="0" border=0>

<frame src=abc.aspx>

<frame src=cde.aspx>

</frameset>

<noframes><body>

</body></noframes>

</>

//*****************说明************************:

frameset是框架,一个网页被划分成几个块,每个块为不同的网页文件。

iframe是内嵌网页,可以被嵌在一个页页的任何地方。

一般iframe使用灵活些。

当使用框架时页面中不应该有body标签。

frameset标签是成对出现的,以<frameset>开始,</frameset>结束,里面用frame。

frameset里面还能嵌入frameset。

嵌套框架,框架可以进行多层嵌套。

frameset里面的id,为了方便后面用Javascript来访问这个对象.

如下:

<frameset rows="58,*" frameborder="NO" border=0 framespacing="0">

<frame src=top. name=topFrame scrolling="NO" noresize><!--页头-->

<frameset rows="*,20" cols="*" framespacing="0" frameborder="NO" border=0>

<frameset rows="*" cols="120,15,*" framespacing="0" frameborder="NO" border=0 id="leftFrameSet">

<frame src=menu. name=leftFrame scrolling="NO" noresize><!--菜单-->

<frame src=mid. name=midFrame scrolling="NO" noresize><!--菜单收缩条-->

<frameset rows="35,*" framespacing="0" frameborder="NO" border=0>

<frame src=navi. name=righttop scrolling="NO" noresize><!--导航-->

<frameset cols="*,200" framespacing="0" frameborder="NO" border=0>

<frame src= name=mainFrame>

<frame src= name=rightFrame scrolling="NO">

</frameset>

</frameset>

</frameset>

<frame src=bottom. name=bottomFrame scrolling="NO" noresize><!--页尾-->

</frameset>

</frameset>

国外免费全能空间(国外十大知名免费空间主机平台推荐)178中文源(适合国人的常用的Cydia源地址搜集)