javascript - 跨浏览器，跨框架下拉菜单的干净解决方案？

Question

首先让我说我真的很喜欢 Superfish(和 jQuery)。不幸的是，这 - 显然？ - 不提供开箱即用的跨框架支持。

情况:外网网站，由2个框架组成，水平划分。顶部框架(最小的框架)包含一个菜单。将鼠标悬停在此菜单上时，“下拉”内容会显示在底部框架中(当然，会显示在其他元素上方)。这是一个示例(实际上，我们今天使用的解决方案):http://javascript.cooldev.com/scripts/coolmenu/demos/frames/

那么有没有人知道如何构建一个干净的(使用标准的 HTML/CSS 和尽可能少的 JS)解决方案？任何帮助，将不胜感激! :)

Answer 1

我想军队会承担起 »抛弃你的框架« 的事情，所以我不会。我假设您已经了解了无框架的替代方案，并得出了您需要框架的结论(无论出于何种 [荒谬] 原因)。

简短的故事是:您无法突破框架，就像您无法突破 window 一样。所有内容都包含在框架/窗口中 - 内容无法渗透。

也就是说，您还有两个选择。

1. 您的父文档恰好是包含两个 iframe 的常规文档，并且所有文档均由同一主机 (SOP) 提供。在这种情况下，您的菜单框架可以在父框架中创建实际上与 iframe 本身重叠的元素。因此，您可以将元素放置在父框架内，使其出现在菜单框架的相应元素下方，同时在内容框架上对其进行 z 索引
2. 您的父框架是框架集文档，因此除框架外不包含任何内容。你真倒霉。您唯一可以做的就是让菜单框架执行 (1) 中描述的相同技巧，但将菜单元素附加到内容框架。

这两种选择都很糟糕。如果你有选择，放弃你的框架。任何愚蠢的服务器端语言(php、ruby、python ……)都允许您将经常重复使用的组件(如导航)提取到单独的文件中，并将它们链接到您拥有的每个其他文档中。 SSI也可能是一种选择。