JavaScrip Zone


新发表

新评论

留言信息

链接收藏

『中国群落博客』

免费注册博客通道

快速登陆


透明背景的开/关设置!

 IE5.5和NN6以上的浏览器支持 Frame ,Iframe对象的 allowTransparency 方法,如果某对象的背景颜色设置为Transparency的,它将继承包含它容器的特性。

a.html如下:

<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY style="BACKGROUND-COLOR: transparent">
<H1>透明文档</H1>
<P>此IFRAME无背景颜色</P>
<P>BODY:<br><BODY STYLE="background-color:transparent"></P></BODY></HTML>

b.html如下:

<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY style="BACKGROUND-COLOR: transparent">
<H1>透明文档</H1>
<P>此IFRAME 设为黄色。</P>
<P>BODY: <br><BODY STYLE="background-color:transparent"></P></BODY></HTML>

如果a.html透明的,它将继承IFRAME的背景颜色 如果容器IFRAME也是透明的,a.html将继承Iframe的父容器的颜色,如果一个对象不透明,它将覆盖其容器的颜色,默认是透明的。

Internet Explorer 5.5 以上版本允许你设置透明属性,通过设置是否可被透明,你可以改变背景的颜色。[在不设置透明属性的情况下,默认背景颜色为白色]

IFRAME定义如下:

<IFRAME ID="frame1" src="/"a.html" allowTransparency="true" HEIGHT=180 WIDTH=300> </IFRAME> <IFRAME ID="frame2" src="/"b.html" allowTransparency="true" STYLE="background-color:#459800" HEIGHT=180 WIDTH=300> </IFRAME>

按钮定义如下:

<INPUT TYPE="button" VALUE="不透明" onclick="turnTransparencyOff()"><INPUT TYPE="button" VALUE="透明" onclick="turnTransparencyOn()">

函数turnTransparencyOff()

function turnTransparencyOff()
{ document.all.frame1.allowTransparency = false; document.all.frame2.allowTransparency = false; }

函数turnTransparencyOn()

function turnTransparencyOn()
{
document.all.frame1.allowTransparency = true; document.all.frame2.allowTransparency = true; }


                                                                 2005-11-30 18:05:05

Posted by jser | 阅读全文() | 回复(0) | 引用通告() | 编辑

..................................................
博客的精神于写自己某一刻的思想或心动!
..................................................
当然要是你愿意就是拿来做记事本也可以!
..................................................
群落博客将提供全程免费服务!免费注册!
..................................................
欢迎您成为群落博客的成员!使用之前请先看系统帮助>>>>系统帮助
..................................................

免费注册群落博客【点击完成注册】
..................................................

发表评论:

    昵称:
    密码: (游客无须输入密码)
    主页:
    标题: