点击frameset边框⾃动隐藏或显⽰窗⼝简单例⼦
因为frameset变宽不能放图⽚，所以这⾥将页⾯分成并列的三部分，其中中间的部分宽度与宽度⼀样，在这个图⽚上加⿏标点击事件，达到以假乱真的效果。
1、主页⾯：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>⽆标题⽂档</title>
</head>
<frameset id="main" cols="200,11,*" frameborder="no" border="0" framespacing="0">
<frame src="frame/left.html" name="leftFrame" id="leftFrame" title="leftFrame" />
<frame src="frame/middle.html" name="middleFrame" id="middleFrame" title="middleFrame"/>
<frame src="frame/right.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
<noframes><body>
</body>
html frame</noframes></html>
2、左边的页⾯，简单的设置下body的背景颜⾊
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>⽆标题⽂档</title>
<style>
body{
background-color:#00FF00;
}
</style>
</head>
<body>
</body>
</html>
3、右边的页⾯，也是简单设置下body的背景颜⾊
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>⽆标题⽂档</title>
<style>
body{
background-color:#0000FF;
}
</style>
</head>
<body>
</body>
</html>
4、中间的页⾯，最重要的界⾯
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>⽆标题⽂档</title>
<style>
html,body{
padding:0;
margin:0;
}
img{
margin-top:200px;
}
</style>
<script language="javascript">
function isShowNav(){
if(window.ls == "200,11,*"){
window.ls = "0,11,*";
}else{
window.ls = "200,11,*";
}
}
</script>
</head>
<body>
<img src="../images/click.jpg" οnclick="isShowNav()" />
</body>
</html>
现在运⾏主页⾯就看到效果了。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。