两帧一滚动条答案

【问题标题】：Two frames one scrollbar两帧一滚动条
【发布时间】：2010-11-21 11:20:21
【问题描述】：

我正在尝试创建两个框架并让它们一起滚动，例如，对于顶部带有不断变化的菜单栏的页面 - 我正在使用轮播 - 或底部的页脚，必须作为页面的一部分出现。

我希望页面看起来像一个也可以滚动的页面，但页面实际上是由两个框架组成的。使用这个...

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

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<!-- Info from: http://www.webxpertz.net/forums/showthread.php?t=257 -->
<!-- Using this... -->

<meta NAME="Description" content="Outer frame(OneBaredFrame) used to wrap the header and body frames" />
<meta HTTP-EQUIV="Cache-Control" content="no-cache" />
<meta HTTP-EQUIV="pragma" content="no-cache" />

<title></title>

</head>

<frameset rows="1,*" border="0" frameborder="no">

<frame src="javascript:<HTML></HTML>" name="dummy" id="dummy" 
frameborder="no" marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>

<frame src="index_inner.html" name="OneBaredFrame"
 id="OneBaredFrame" frameborder="no" marginheight="0" marginwidth="0"  noresize="noresize" scrolling="yes"></frame>

<!-- the bottom frame above if scrolling="yes" doesn't show a scrollbar for me? -->

<!-- the top frame above if scrolling="yes" does show a scrollbar for me if rows="100,*" say? -->

</frameset>

</html>

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

<html xmlns="http://www.w3.org/1999/xhtml">


<head>

<meta NAME="Description" content="Frames for within a scrollable frame">

<meta HTTP-EQUIV="Cache-Control" content="no-cache">

<meta HTTP-EQUIV="pragma" content="no-cache">

<title></title>

</head>

 <!-- My header and body frames need to scroll together, 
 so I am using another frameset (the one above) to enclose these frames -->

<frameset rows="215,*" border="0" frameborder="no"> 
<frame src="Header.html" id="header" name="header" frameborder="no"
 marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>

<frame src="index_body.html" id ="body" name="body" frameborder="no" 
marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>

<!-- when the above are set to scrolling="yes" scrollbars appear for me for each -->

</frameset>

</html>

【问题讨论】：

在代码主体内（作为评论）提出问题是非常糟糕的做法。提出问题，发布代码 - 更多人会阅读它。这次我会为你解决这个问题。
感谢 Oded 的帮助，我花了很长时间才尝试发布我所做的。

标签： html frames

【解决方案1】：

使用框架时，每个框架都会有自己的滚动条。

你不能有两个框架的单个滚动条，正是因为是两个框架。

更新：

您可以解决此问题，方法是使两个框架都不滚动并将它们都包装在 第三个滚动框架中（其存在的唯一原因是提供单个滚动条） .父框架将同时处理两个内部框架的滚动。

您需要添加一个具有如下框架集的新页面，确保第二个页面指向您的框架集（并在两个框架集上设置SCROLLING="NO"：

<FRAMESET ROWS="0%,100%"
  BORDER="0"
  FRAMEBORDER="NO">
  <FRAME SRC=""
    NAME="dummy"
    FRAMEBORDER="NO"
    MARGINHEIGHT="0"
    MARGINWIDTH="0"
    NORESIZE
    SCROLLING="NO">
  </FRAME>
  <FRAME SRC="*url to your frameset*"
    NAME="myframes"
    FRAMEBORDER="NO"
    MARGINHEIGHT="0"
    MARGINWIDTH="0"
    NORESIZE
    SCROLLING="YES">
  </FRAME>
</FRAMESET>

【讨论】：

那么webxpertz.net/forums/showthread.php?t=257 的 Sloey 是不是错了 - 只是为了确定一下？
@carpenter - 他是对的。解决方法将起作用。但是，这会引入 第三个 框架。
再次感谢，但任何帮助我的代码让它工作，因为我试图按照他给出的但无法让它工作......我不聪明所以对我温柔- 如果可以的话:)

【解决方案2】：

我使用 IFRAME 找到了您要查找的内容。

它甚至比 FRAME 更灵活，因为它不需要您将窗口从一个边缘分割到另一个边缘，并且每个帧边界不需要与另一个对齐。

我将它用于我刚刚部署的网页，它就像一个魅力。

有一个缺点：主框架的高度必须预先固定，并且您需要高估它以避免内部滚动条。

<BODY>
<CENTER>
  <DIV style="display:table-cell; width:800; ">
      <iframe WIDTH=800 HEIGHT=220 src="menu.html" name="topframe" frameBorder=0 SCROLLING=NO></iframe>
      <iframe WIDTH=800 HEIGHT=380 src="home.html" name="contentframe" frameBorder=0 SCROLLING=AUTO></iframe>
      <iframe WIDTH=800 HEIGHT=220 src="menu.html" name="bottomframe" frameBorder=0 SCROLLING=NO></iframe>
  </DIV>
<CENTER>
</BODY>

menu.html 中带有 TARGET="contentframe" 的链接做你想做的事。

【讨论】：