摘自《网页开发手记》
1、frameset.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>仿猫扑框架页面</title>
<script>
function Set(){
if(document.getElementById("main").cols == "100,45,*"){
document.getElementById("main").cols = "0,45,*"
} else {
document.getElementById("main").cols = "100,45,*"
}
}
</script>
</head>
<frameset id="main" cols="100,12,*" framborder="0" framspacing="0" bordercolor="#ff0000">
<frame src="left.html" name="leftframe" noresize="noresize" scrolling="auto"/>
<frame src="mid.html" name="midframe" scrolling="auto"/>
<frame src="right.html" name="rightframe" scrolling="auto"/>
</frameset><noframes></noframes>
</html>
2、left.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>帖子列表</title>
</head>
<body>
帖子列表
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>控制伸缩</title>
<script type="text/javascript">
function Click(){
parent.Set();
}
</script>
<style type="text/css">
*{margin: 0px; padding: 0px}
</style>
</head>
<body>
<button οnclick="Click()">缩放</button>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>正文内容</title>
</head>
<body>
正文内容
</body>
</html>