Question

总而言之，我正在尝试制作实时页面渲染（浏览网站），同时具有覆盖功能的菜单。

我可能在设计应用程序时遇到了错误，需要替代框架。任何建议都表示赞赏。

因此，应用程序的目标是分析Web内容。它有一个通常的东西的全局菜单：配置文件，注销，设置。具有标准法律资料的全球页脚，中间是所有功能的所在。

我知道其中一项功能是网站的实时渲染，底部有一个菜单覆盖。有了它，他们可以查看元素并写出有关内容的评论。

每个功能都嵌入在一个框架内，所以如果我点击页面查看按钮，框架将射向框架页面并进行中继。这是问题所在。为了获得一个网站的实时渲染并以这种方式使用它，我不得不在一个框架内放置一个框架，因此重复的滚动条就诞生了。

如果有人对布局的工作原理感到困惑，那么这里有两个镜头。 http://s1180.photobucket.com/albums/x406/0vertone/?action=view&current=pageviewlayout.jpg 一个更清洁的设计师模型（主要是全球菜单） http://s1180.photobucket.com/albums/x406/0vertone/?action=view&current=globalview.jpg

我有编码和覆盖菜单，我尝试了手风琴和css风格的幻灯片。您可以在这里查看代码。

全球菜单： 将其保存为global.html.erb http://paste.ubuntu.com/648135/

PAGE VIEW： 将其保存为pageview.html.erb http://pastebin.ubuntu.com/648146/ 一旦你完成了这个，它应该按照你的期望工作。

它所做的技术或方式是选择，但设计不是。现在看，在实时网站底部的页面视图上，但在页脚上方。需要有一个可以滑出的重叠菜单。如果有人对如何实现网站的实时视图和重叠菜单有任何想法，我会全力以赴。

谢谢

快速摘要：

我想要实现的是一个具有全局菜单的应用程序，该菜单在所有页面上保持一致。在这个全局菜单的中间是一个框架，它转到我创建的其他页面，例如列表视图，统计信息和页面视图。

页面视图是我目前正在进行的工作。在页面视图中有2个组件，网站的实时视图（他们想要的任何页面）和底部的重叠菜单。想想就像页面底部的youtubes播放列表一样。问题是，为了将这个网站的实时渲染放在框架中，你在iframe中有一个iframe而我;我试图解决这个问题。

但是，我不是将其视为一个错误，而是在寻找替代方法来实现上述目标

我在pastebin上提供的最终解决方案：页面预览： http://paste.ubuntu.com/648246/

全球观点： http://paste.ubuntu.com/648250/

基本上这个 jQuery的（ '＃iframeWrapper'）的高度（'61％'）;

Answer 1

这是CSS和div的快速演示 - 您可以使用此方法执行您想要的操作。

<style type="text/css">
#holder {position:absolute;left:0;top:0;width:425px;height:350px;z-index:1;}
#menu {position:absolute; left:0;top:300px;height:50px;background-color:#f0f;width:425px;z-index:10;}
</style>

<div id="holder">

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.uk/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=firebox&amp;aq=&amp;sll=53.800651,-4.064941&amp;sspn=17.72791,44.736328&amp;ie=UTF8&amp;hq=firebox&amp;hnear=&amp;z=5&amp;iwloc=A&amp;cid=2836054255231781537&amp;ll=51.386465,-0.138487&amp;output=embed"></iframe><br /><small><a href="http://maps.google.co.uk/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=firebox&amp;aq=&amp;sll=53.800651,-4.064941&amp;sspn=17.72791,44.736328&amp;ie=UTF8&amp;hq=firebox&amp;hnear=&amp;z=5&amp;iwloc=A&amp;cid=2836054255231781537&amp;ll=51.386465,-0.138487" style="color:#0000FF;text-align:left">View Larger Map</a></small>

</div>

<div id="menu">Nav / whatever goes here</div>

还可以选择使用ajax将内容调用到#holder div而不是使用iFrame

需要替代HTML框架（我现在知道他们为什么是邪恶的）

1 个答案: