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

标签 javascript html css jquery-plugins

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

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

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

最佳答案

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

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

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

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

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

关于javascript - 跨浏览器,跨框架下拉菜单的干净解决方案?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3776979/

相关文章:

jquery - 表格与滚动条的对齐不正确

html - 滚动后更改颜色导航栏

html - div 中的居中文本和 calc() 疑惑

javascript - 在没有固定高度/虚拟化的情况下提高长列表的性能

javascript - 帮助避免全局命名空间 - 两个例子 - 哪个更好?

javascript - 为此加载点脚本选择不同的颜色

html - chrome 中的 anchor 标记无法正常工作?这是 chrome 错误吗?

php - 使用AJAX/PHP/JS在一个较长的过程中报告多个状态消息

javascript - div 在页面加载或刷新时加载 css 的问题

php - 抓取 Soundcloud 图像