两框一滚动条
我正在尝试创建两个框架并使它们一起滚动, 例如,在顶部菜单栏不断变化的页面中 - 我正在使用轮播 - 或底部的页脚, 必须作为页面的一部分出现。
我希望页面看起来像一个可以滚动的页面, 但页面实际上是由两个框架组成的。 使用这个...
<!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>
I'm trying to create two frames and make them scroll together,
for instance in the case of a page with a changing menu bar at the top -
I'm using a carousel - or a footer at the bottom,
that must appear as part of the page.
I want a page to look like one page that is also capable of scrolling,
but the page is actually composed of two frames.
Using this...
<!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>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
使用框架时,每个框架都会有自己的滚动条。
两个框架不能有一个滚动条,正是因为是两个框架。
更新:
您可以通过使两个框架不滚动并将它们包装在第三个滚动框架内(其存在的唯一原因是提供单个滚动条)来解决此问题。父框架将同时处理两个内部框架的滚动。
您需要添加一个具有如下框架集的新页面,确保第二个页面指向您的框架集(并在两个框架集上设置
SCROLLING="NO"
:When using frames, each will get its own scroll bars.
You can't have a single scroll bar for two frames, precisely because the are two frames.
Update:
You can workaround this by making both frames non scrolling and wrapping both them within a third scrolling frame (whose only reason to exist is to provide a single scroll bar). The parent frame will handle scrolling of both inner frames together.
You need to add a new page with a frameset like the following, making sure the second one points to your frameset (and set
SCROLLING="NO"
on both framesets:我用 IFRAME 得到了你要找的东西。
它比 FRAME 更灵活,因为它不需要将窗口从一个边缘分割到另一个边缘,并且每个帧边界不需要与另一个帧边界对齐。
我将其用于刚刚部署的网页,它的效果就像一个魅力。
有一个缺点:主框架的高度必须事先固定,并且您需要高估它以避免出现内部滚动条。
menu.html 中带有 TARGET="contentframe" 的链接可以执行您想要的操作。
I got what you are looking for using IFRAME.
It's even more flexible than FRAME, since it doesn't require you to split the window from edge to edge, and each frame boundary doesn't need to be aligned with another one.
I used this for a webpage I just deployed and it works like a charm.
There is one drawback: the height of the principal frame must be fixed beforehands, and you need to overestimate it in order to avoid an inner scrollbar.
Links in menu.html with TARGET="contentframe" do what you want it to do.