asp.net frameset 框架页面伸缩功能实现

简介: 1、新建Left.aspx、Right.aspx和Top.aspx页面 2、新建一个index.

1、新建Left.aspx、Right.aspx和Top.aspx页面


2、新建一个index.html页面,使用框架页包含以上3个aspx页面


3、各个页面代码如下

Top.aspx页面


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Top.aspx.cs" Inherits="Top" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>头部页面</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <img id="pic" height="12" alt="显示/隐藏" hspace="4" src="img/hide_menu.gif" width="15"
            border="0" onclick="changeVisible();" /><span id="dir">隐藏快捷栏</span> 头部标题页面
    </div>
    </form>
</body>
</html>

<script language="javascript" type="text/javascript">
    function changeVisible() {
        if (parent.bottom.cols != '190,*') {
            parent.bottom.cols = '190,*';
            document.all.pic.src = "img/hide_menu.gif";
            document.all.dir.innerHTML = "隐藏快捷栏"
        }
        else {
            parent.bottom.cols = '0,*';
            document.all.pic.src = "img/show_menu.gif";
            document.all.dir.innerHTML = "显示快捷栏"
        }
    }

</script>



Left.aspx页面


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Left.aspx.cs" Inherits="Left" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>左侧导航菜单页面</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        左侧导航菜单栏
    </div>
    </form>
</body>
</html>



Right.aspx页面


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Right.aspx.cs" Inherits="Right" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>右侧主要显示内容区域</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        中间区域显示内容
    </div>
    </form>
</body>
</html>




index.htm页面


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>框架页面</title>
</head>
<frameset id="fsTop" border="0" framespacing="0" rows="122,*" topmargin="0" leftmargin="0"
    marginheight="0" marginwidth="0" cols="*">
		<frame border="1" name="top" marginwidth="0" marginheight="0" src="Top.aspx" frameborder="no"
			noResize scrolling="no" topmargin="0" leftmargin="0" bordercolor="#e4e4e4">
		<frameset border="1" name="bottom" framespacing="0" frameborder="1" cols="190,*" topmargin="0"
			leftmargin="0" rightmargin="0" marginheight="0" marginwidth="0">
			<frame border="1" name="menu" marginwidth="0" marginheight="0" frameborder="0" topmargin="0"
				leftmargin="0" target="main" scrolling="no" noresize="true" bordercolor="#e4e4e4" src="Left.aspx"
				style="BORDER-TOP: #000000 1px solid"/>
			<frame style="BORDER-TOP: #000000 1px solid; BORDER-LEFT: #ffffff 2px groove" border="2"
				name="main" id="main" bordercolor="#e4e4e4" src="Right.aspx" frameborder="no" scrolling="auto"
				marginwidth="0" marginheight="0"/>
		</frameset>
	</frameset>
<noframes>
</noframes>
</html>



效果图如下:


 

PS补充说明:

如果想在top页面控制main区域的页面地址,使用:

parent.window.frames['main'].location.href = "sysSecurity/ChangePassword.aspx"; 

 

如果想重新加载页面的话

parent.window.frames['main'].location.reload();


 



相关文章
|
8天前
|
存储 文字识别 C#
.NET开源免费、功能强大的 Windows 截图录屏神器
今天大姚给大家分享一款.NET开源免费(基于GPL3.0开源协议)、功能强大、简洁灵活的 Windows 截图、录屏、Gif动图制作神器:ShareX。
|
8天前
|
数据可视化 网络协议 C#
C#/.NET/.NET Core优秀项目和框架2024年3月简报
公众号每月定期推广和分享的C#/.NET/.NET Core优秀项目和框架(每周至少会推荐两个优秀的项目和框架当然节假日除外),公众号推文中有项目和框架的介绍、功能特点、使用方式以及部分功能截图等(打不开或者打开GitHub很慢的同学可以优先查看公众号推文,文末一定会附带项目和框架源码地址)。注意:排名不分先后,都是十分优秀的开源项目和框架,每周定期更新分享(欢迎关注公众号:追逐时光者,第一时间获取每周精选分享资讯🔔)。
|
2月前
|
开发框架 JavaScript 前端开发
5个.NET开源且强大的快速开发框架(帮助你提高生产效率)
5个.NET开源且强大的快速开发框架(帮助你提高生产效率)
|
26天前
|
开发框架 网络协议 .NET
深入.net框架
深入.net框架
11 0
|
1月前
|
Windows
windows server 2019 安装NET Framework 3.5失败,提示:“安装一个或多个角色、角色服务或功能失败” 解决方案
windows server 2019 安装NET Framework 3.5失败,提示:“安装一个或多个角色、角色服务或功能失败” 解决方案
|
2月前
|
算法 BI API
C#/.NET/.NET Core优秀项目和框架2024年1月简报
C#/.NET/.NET Core优秀项目和框架2024年1月简报
|
2月前
|
C# Windows
.NET开源的一个小而快并且功能强大的 Windows 动态桌面软件
.NET开源的一个小而快并且功能强大的 Windows 动态桌面软件
|
3月前
|
PHP Windows
php扩展com_dndnet(PHP与.NET框架进行交互)
php扩展com_dndnet(PHP与.NET框架进行交互)
php扩展com_dndnet(PHP与.NET框架进行交互)
|
3月前
|
开发框架 前端开发 JavaScript
一款基于.NET Core的快速开发框架、支持多种前端UI、内置代码生成器
一款基于.NET Core的快速开发框架、支持多种前端UI、内置代码生成器