怎样定位层,在800*600上的位置和1024*768上位置保持一致

建议不要用层，用iframe: <html>
<head>
<script language=javascript>
function cc(){
  var hh = document.body.clientHeight;
  hh = hh > document.all.td1.clientHeight ? hh : document.all.td1.clientHeight;
  document.all.left.style.height = hh - document.all.td1.clientHeight;
  document.all.main.style.height = hh - document.all.td1.clientHeight;
  }
window.onresize=cc;
</script>
</head><body topmargin=0 leftmargin=0 onload="cc()"><center>
<table border=0 width=780 cellspacing=0 cellpadding=0 align=center>
  <tr><td width=780 colspan=2 bgcolor=#ff0000 id=td1>
      <iframe width=100% name=top  height=100 frameborder=1></iframe>
  </td></tr>
  <tr>
    <td width=180>
      <iframe width=100% name=left height=100 frameborder=1></iframe>
    </td>
    <td width=600>
      <iframe width=100% name=main height=100 frameborder=1></iframe>
    </td>
  </tr>
</table>
</center></body></html>

解决方案 »

  1.   

    <HTML>
    <HEAD>
    <TITLE></TITLE>
    <META http-equiv=Content-Type content="text/html; charset=gb2312">
    <STYLE type=text/css>
    .alpha {
    FILTER: Alpha(Opacity=80)
    }
    .td1 {
    FONT-SIZE: 10px; font-family: "tahoma"}
    .td2 {
    FONT-SIZE: 10px; CURSOR: hand; BACKGROUND-COLOR: #CFE7FF
    ; font-family: "tahoma"}
    .maskl {
    OVERFLOW: hidden
    }
    .cardtitle {
    BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FONT-SIZE: 10px; BORDER-LEFT: black 0px solid; CURSOR: default; TEXT-INDENT: 4pt; BORDER-BOTTOM: black 0px solid
    ; font-family: "tahoma"}
    .cardbottom {
    BORDER-RIGHT: black 1px solid; BORDER-TOP: black 0px solid; FILTER: Alpha(Opacity=90); BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid; BACKGROUND-COLOR: #99ccff
    }
    </STYLE>
    <SCRIPT language=Jscript>
    //用数组来存储多个timeOut标识.
    tBack=new Array(6);
    tOut=new Array(6);
    //激活当前选项卡.
    function menuOut(whichMenu){
    var curMenu=eval("menu"+whichMenu);
    curMenu.runtimeStyle.zIndex=6;
    clearTimeout(tBack[whichMenu]);
    moveOut(whichMenu);
    }
    //恢复初始状态.
    function menuBack(whichMenu){
    var curMenu=eval("menu"+whichMenu);
    curMenu.runtimeStyle.zIndex=curMenu.style.zIndex;
    clearTimeout(tOut[whichMenu]);
    moveBack(whichMenu);
    }
    //移动当前选项卡
    function moveOut(curNum){
    var curMenu=eval("menu"+curNum);
    if(curMenu.style.posLeft>0) {
    curMenu.style.posLeft-=2;
    tOut[curNum]=setTimeout("moveOut('"+curNum+"')",1);
    }
    }
    //移回选项卡.
    function moveBack(curNum){
    var curMenu=eval("menu"+curNum);
    if(curMenu.style.posLeft<30) {
    curMenu.style.posLeft+=2;
    tBack[curNum]=setTimeout("moveBack('"+curNum+"')",1);
    }}
    //鼠标移过时改变表格单元式样。
    function swapClass(){
    var o=event.srcElement;
    if(o.className=="td1") o.className="td2"
    else if(o.className=="td2") o.className="td1";
    }
    document.onmouseover=swapClass;
    document.onmouseout=swapClass;
    </SCRIPT>
    </HEAD>
    <BODY text=#000000 bgColor=#ffffff leftMargin=0 topMargin=0 marginheight="0" marginwidth="0">
    <DIV class=maskl id=menuPos 
    style="Z-INDEX: 1; LEFT: 12px; WIDTH: 132px; POSITION: absolute; TOP: 14px; HEIGHT: 236px"> 
      <DIV id=menu1 onmouseover=menuOut(1) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 0px; HEIGHT: 20px" 
    onmouseout=menuBack(1)>
    <DIV class=cardbottom id=Layer1 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD1</TD></TR>
    </TABLE></DIV>
    <DIV id=menu2 onmouseover=menuOut(2) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 20px; HEIGHT: 20px" 
    onmouseout=menuBack(2)>
    <DIV class=cardbottom id=Layer2 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD2</TD></TR>
    </TABLE></DIV>
    <DIV id=menu3 onmouseover=menuOut(3) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 40px; HEIGHT: 20px" 
    onmouseout=menuBack(3)>
    <DIV class=cardbottom id=Layer3 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD3</TD></TR>
    </TABLE></DIV>
    <DIV id=menu4 onmouseover=menuOut(4) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 60px; HEIGHT: 20px" 
    onmouseout=menuBack(4)>
    <DIV class=cardbottom id=Layer4 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD4</TD></TR>
    </TABLE></DIV>
    <DIV id=menu5 onmouseover=menuOut(5) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 80px; HEIGHT: 134px" 
    onmouseout=menuBack(5)>
    <DIV class=cardbottom id=Layer5 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
            <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD5</TD></TR>
    </TABLE></DIV>
      <DIV id=menu6 onmouseover=menuOut(6) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 100px; HEIGHT: 134px" 
    onmouseout=menuBack(6)> 
        <DIV class=cardbottom id=Layer6 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
            <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD6</TD></TR>
    </TABLE></DIV></DIV>
    </BODY>
    </HTML>
      

  2.   

    <HTML>
    <HEAD>
    <TITLE></TITLE>
    <META http-equiv=Content-Type content="text/html; charset=gb2312">
    <STYLE type=text/css>
    .alpha {
    FILTER: Alpha(Opacity=80)
    }
    .td1 {
    FONT-SIZE: 10px; font-family: "tahoma"}
    .td2 {
    FONT-SIZE: 10px; CURSOR: hand; BACKGROUND-COLOR: #CFE7FF
    ; font-family: "tahoma"}
    .maskl {
    OVERFLOW: hidden
    }
    .cardtitle {
    BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FONT-SIZE: 10px; BORDER-LEFT: black 0px solid; CURSOR: default; TEXT-INDENT: 4pt; BORDER-BOTTOM: black 0px solid
    ; font-family: "tahoma"}
    .cardbottom {
    BORDER-RIGHT: black 1px solid; BORDER-TOP: black 0px solid; FILTER: Alpha(Opacity=90); BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid; BACKGROUND-COLOR: #99ccff
    }
    </STYLE>
    <SCRIPT language=Jscript>
    //用数组来存储多个timeOut标识.
    tBack=new Array(6);
    tOut=new Array(6);
    //激活当前选项卡.
    function menuOut(whichMenu){
    var curMenu=eval("menu"+whichMenu);
    curMenu.runtimeStyle.zIndex=6;
    clearTimeout(tBack[whichMenu]);
    moveOut(whichMenu);
    }
    //恢复初始状态.
    function menuBack(whichMenu){
    var curMenu=eval("menu"+whichMenu);
    curMenu.runtimeStyle.zIndex=curMenu.style.zIndex;
    clearTimeout(tOut[whichMenu]);
    moveBack(whichMenu);
    }
    //移动当前选项卡
    function moveOut(curNum){
    var curMenu=eval("menu"+curNum);
    if(curMenu.style.posLeft>0) {
    curMenu.style.posLeft-=2;
    tOut[curNum]=setTimeout("moveOut('"+curNum+"')",1);
    }
    }
    //移回选项卡.
    function moveBack(curNum){
    var curMenu=eval("menu"+curNum);
    if(curMenu.style.posLeft<30) {
    curMenu.style.posLeft+=2;
    tBack[curNum]=setTimeout("moveBack('"+curNum+"')",1);
    }}
    //鼠标移过时改变表格单元式样。
    function swapClass(){
    var o=event.srcElement;
    if(o.className=="td1") o.className="td2"
    else if(o.className=="td2") o.className="td1";
    }
    document.onmouseover=swapClass;
    document.onmouseout=swapClass;
    </SCRIPT>
    </HEAD>
    <BODY text=#000000 bgColor=#ffffff leftMargin=0 topMargin=0 marginheight="0" marginwidth="0">
    <DIV class=maskl id=menuPos 
    style="Z-INDEX: 1; LEFT: 12px; WIDTH: 132px; POSITION: absolute; TOP: 14px; HEIGHT: 236px"> 
      <DIV id=menu1 onmouseover=menuOut(1) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 0px; HEIGHT: 20px" 
    onmouseout=menuBack(1)>
    <DIV class=cardbottom id=Layer1 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD1</TD></TR>
    </TABLE></DIV>
    <DIV id=menu2 onmouseover=menuOut(2) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 20px; HEIGHT: 20px" 
    onmouseout=menuBack(2)>
    <DIV class=cardbottom id=Layer2 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD2</TD></TR>
    </TABLE></DIV>
    <DIV id=menu3 onmouseover=menuOut(3) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 40px; HEIGHT: 20px" 
    onmouseout=menuBack(3)>
    <DIV class=cardbottom id=Layer3 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD3</TD></TR>
    </TABLE></DIV>
    <DIV id=menu4 onmouseover=menuOut(4) 
    style="Z-INDEX: 1; LEFT: 30px; WIDTH: 130px; POSITION: absolute; TOP: 60px; HEIGHT: 20px" 
    onmouseout=menuBack(4)>
    <DIV class=cardbottom id=Layer4 
    style="Z-INDEX: 1; LEFT: 0px; WIDTH: 100px; POSITION: absolute; TOP: 17px; HEIGHT: 115px">
          <TABLE height="100%" width=100% align=center border=0 cellpadding="0" cellspacing="0">
            <TR>
        <TD class=td1 align="center">option1</TD></TR>
      <TR>
        <TD class=td1 align="center">option2</TD></TR>
      <TR>
        <TD class=td1 align="center">option3</TD></TR>
      <TR>
        <TD class=td1 align="center">option4</TD></TR>
      <TR>
        <TD>&nbsp;</TD></TR>
    </TABLE></DIV>
    <TABLE cellSpacing=0 cellPadding=0 width=100 border=0>
      <TR>
        <TD width=14 height=18><IMG height=18 src="stang.gif" 
          width=14></TD>
        <TD class=cardtitle width=86 bgColor=#99ccff 
    height=14>MENUCARD4</TD></TR>
    </TABLE></DIV>
    </DIV>
    <table width="938" border="0" cellpadding="0" cellspacing="0">
      <!--DWLayoutTable-->
      <tr> 
        <td width="197" height="7"></td>
        <td width="210"></td>
        <td width="531"></td>
      </tr>
      <tr>
        <td height="387"></td>
        <td valign="top" bgcolor="#9933FF"><!--DWLayoutEmptyCell-->&nbsp;</td>
        <td></td>
      </tr>
    </table>
    </BODY>
    </HTML>
    -----------------------------------------------------------
    高手，怎样让menu放在紫色table里，无论在800还是1024
      

  3.   

    <style type="text/css">
      .window { BORDER-RIGHT: #606060 2px solid; PADDING-RIGHT: 2px; BORDER-TOP: #f0f0f0 2px solid; PADDING-LEFT: 2px; VISIBILITY: ; PADDING-BOTTOM: 2px; MARGIN: 0px; BORDER-LEFT: #d0d0d0 2px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #404040 2px solid; POSITION: absolute; BACKGROUND-COLOR: #184BA5; TEXT-ALIGN: left;  }
      .titleBar {PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; FONT-SIZE: 9pt; PADDING-BOTTOM: 2px; MARGIN: 0px; WIDTH: auto; CURSOR: default; COLOR: #ffffff; PADDING-TOP: 2px; FONT-FAMILY: 宋体; WHITE-SPACE: nowrap;}
      .titleBarText { PADDING-LEFT: 6px; OVERFLOW: hidden; TEXT-ALIGN: left;}
      .clientArea {PADDING:10px; FONT-FAMILY: 宋体; BACKGROUND-COLOR: #ECF0E1}
    </style></head>
    <body onselectstart="return false" onload="document.LogonForm.UserName.focus();document.LogonForm.reset()" background="../images/logonBg.jpg">
    <div class="window" id="logon" style="LEFT:expression(Math.abs(Math.round((window.document.body.clientWidth - logon.offsetWidth)/2))); WIDTH: 360px; TOP:expression(Math.abs(Math.round((window.document.body.clientHeight - logon.offsetHeight)/2)))" style="filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#FF003399', EndColorStr='#FF6699CC');">
      <div class="titleBar"><span class="titleBarText">请先登录</span></div>    <div class="clientArea" style>
        &nbsp;&nbsp;请输入您授权管理的用户名和密码。
        <br><br>    
        <table align="center" width="300" border="0" cellpadding="0" cellspacing="6">
        <form action="logon.asp" method="post" name="LogonForm">
        <tr>
          <td align="center">用户名：</td>
          <td><input type="text" name="UserName" value style="border:1px solid gray"></td>
        </tr>
        <tr>
          <td align="center">密&nbsp;&nbsp;码：</td>
          <td><input type="password" name="Password" style="border:1px solid gray"></td>
        </tr>
        <tr>
          <td colspan="2" align="center">
            <input type="submit" value=" 登  录 " name="logon" class="CustButton" style="padding-top:2px">
            <input type="hidden" name="href" value="">
          </td>
        </tr>
        </form>
        </table>    
        <div align="center">&nbsp;<font color="red">
        
        </font>
      </div>
      </div></div></body>
    </html>
      

  4.   


    i see the code,let me have a try! 
    thank u ------net_lover(孟子E章) ------------
    高手就是高手！！！
      

  5.   

    给你20分太少了，真的是感激万分
    keep touch