用div+iframe 代替frameset 框架

最新推荐文章于 2023-12-05 10:40:57 发布

jnhh95

最新推荐文章于 2023-12-05 10:40:57 发布

阅读量852

点赞数

分类专栏： Web前端文章标签： c#

Web前端专栏收录该内容

1 篇文章

订阅专栏

frameset 已经过时, 使用frameset会带来很多问题,比如session丢失等. 所以提倡用iframe,iframe的好处我就不用多说了.下面用div+iframe来代替frameset的收缩与展开功能.

[html] view plain copy print ?

<%@ Page Language="C#" AutoEventWireup="true" Codebehind="Default.aspx.cs" Inherits="ProductServices10._Default" %>
<!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 id="Head1" runat="server">
<title>产品服务系统</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html,body{
margin:0px;
height:100%;
}
</style>
<script language="javascript" type="text/javascript">
function DisplayNav()
{
var nav = document.getElementById('divLeft');
var main = document.getElementById('divmain');
if(nav.style.display=='block'|| nav.style.display=='')
{
nav.style.display='none';
main.style.display = 'block';
}
else
{
nav.style.display='block';
main.style.marginleft='395px';
}
}
</script>
</head>
<body style="margin: 0; padding: 0; background-color: #0266C6;">
<form id="from1" runat="server">
<div id="divTop" style="width: 100%; height: 60px; border: none 0px">
<img src="Images/Top/toplogo.jpg" onclick="DisplayNav();" />
</div>
<div style="width:100%;height: 100%; border: none 0px">
<div id="divLeft" style="width: 195px; height:100%; overflow: hidden; float: left;">
<iframe src="left.aspx" style="height: 100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe>
</div>
<div id="divmain" style="height: 100%; border: none 0px">
<iframe src="main.aspx" width="100%" height="100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe>
</div>
</div>
</form>
</body>
<html>

<%@ Page Language="C#" AutoEventWireup="true" Codebehind="Default.aspx.cs" Inherits="ProductServices10._Default" %>



<!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 id="Head1" runat="server">

    <title>产品服务系统</title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <style type="text/css">

        html,body{

     margin:0px;

     height:100%;

    }

    </style>

    <script language="javascript" type="text/javascript">

        function DisplayNav()

        {

            var nav = document.getElementById('divLeft');

            var main = document.getElementById('divmain');

            if(nav.style.display=='block'|| nav.style.display=='')

            {

                nav.style.display='none';

                

                main.style.display = 'block';

            }

            else

            {

                nav.style.display='block';

                main.style.marginleft='395px';

            }

        }

    </script>

</head>

<body style="margin: 0; padding: 0; background-color: #0266C6;">

    <form id="from1" runat="server">

        <div id="divTop" style="width: 100%; height: 60px; border: none 0px">

            <img src="Images/Top/toplogo.jpg" onclick="DisplayNav();" />

        </div>

        <div style="width:100%;height: 100%; border: none 0px">

            <div id="divLeft" style="width: 195px; height:100%; overflow: hidden; float: left;">

                <iframe src="left.aspx" style="height: 100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe>

            </div>

            <div id="divmain" style="height: 100%; border: none 0px">

                     <iframe src="main.aspx" width="100%" height="100%" frameborder="0" border="0" marginwidth="0" marginheight="0" ></iframe>

            </div>

        </div>

    </form>

</body>

<html>