jQuery Suckerfish 菜单

发布日期 作者

我认为我们都听说过或使用过 Suckerfish CSS 菜单,它由 Pattrick Griffiths 和 Dan Webb 为 A List Apart 编写。如果没有,这是一个使用基于标准的语义 HTML 和 CSS 创建下拉菜单的酷炫方法。不幸的是,由于 IE 仍然主导着浏览器市场,我们仍然需要一种方法来处理 IE 中的悬停状态。为此,我们需要一些 JavaScript 将鼠标悬停和鼠标移出事件附加到 HTML 元素。

Myles Angell 决定 使用 jQuery 重写 Suckerfish 的 JavaScript。Myles 使用 jQuery 的 基本效果 来显示和隐藏子菜单,并使用 jQuery 的 BaseStyle 基本模块方法 来突出显示当前鼠标悬停的菜单项。非常酷。

查看 Myles 使用 jQuery 的其他一些实验。对于 jQuery 初学者来说,这些都是很好的入门示例。该 树状视图 是另一个引起我注意的实验。

关于“jQuery Suckerfish 菜单”的 7 个想法

  1. Andrew 说道:

    太棒了!但是,如果我尝试水平居中,下拉菜单似乎会失去对齐。有没有人找到一种方法来居中此菜单?

  2. Realazy 说道:

    是的,我认为没有比 jQuery 更简单的 js 库/框架适合 Web 标准/CSS 设计师/开发人员,它非常简单、干净且清晰。对我来说,以前没有任何编程经验,但我可以用 jQuery 处理很多事情!非常感谢 jQuery 及其开发人员(只有 John?)。

    我希望 1.0 版能尽快发布,并附带新的文档。:)

    干杯!

  3. ritchie 说道:

    Myles,干得好。我注意到,一级菜单的活动状态仅在使用背景色时保持活动状态(当下拉菜单可见时),但是,如果您尝试使用背景图像,并尝试将其定位在活动状态(例如,backround-position: 0 -31px),它不起作用。如何更改代码以使其正常工作?

  4. Pingback: Sukerfish 有什么不好吗?| 360aday.com

  5. Marcel 说道:

    这似乎不适用于通过 Google 托管的 jQuery 版本。我不知道为什么。它快把我逼疯了。