最好的 Javascript 下拉菜单?[关闭]
-
01-07-2019 - |
题
我正在寻找一个 JavaScript 下拉菜单。
它应该是最简单、最优雅的可访问菜单,也适用于 IE6 和 Firefox 2。如果它适用于未编号的列表(ul
)这样用户就可以在没有 JavaScript 支持的情况下使用该页面。
您推荐哪一个?我在哪里可以找到此类菜单的代码?
解决方案
我认为 jquery superfish 菜单非常棒并且易于使用:
http://users.tpg.com.au/j_birch/plugins/superfish/
JavaScript 是 不需要, ,并且它基于简单的有效 ul 无序列表。
其他提示
我会使用像上面这样的纯CSS解决方案,这样即使禁用了JavaScript,用户仍然可以获得下拉菜单。
这是我使用 jQuery 的答案:
jQuery.fn.ddnav = function() {
this.wrap("");
this.each(function() {
var sel = document.createElement('select');
jQuery(this).find("li.label, li a").each(function() {
jQuery("<option>").val(this.href ? this.href : '').html(jQuery(this).html()).appendTo(sel);
});
jQuery(this).hide().after(sel);
});
this.parent().find("select").after("<input type=\"button\" value=\"Go\">");
var callback = function(button) {
var url = jQuery(button.target).parent("div").find("select").val();
if(url.length)
window.open(url, "_self")
};
this.parent().find("input[type='button']").click(callback);
this.parent().find("select").change(callback);
return this;
};
然后在你的 onready 处理程序中:
$("ul.dropdown_nav").ddnav();
但我要指出的是,这些对于可用性来说非常糟糕。最好使用列表并立即向人们展示所有选项,并且最好不要在选择后导航离开和/或需要按下不同的按钮才能到达他们想要的位置。
我认为你最好永远不要使用上面的内容(我写了代码!)
对于纯粹主义者: http://www.grc.com/menudemo.htm绝对没有 JavaScript,只有纯 CSS - 并且几乎适用于所有浏览器。
稍加调整就可以使它们看起来像精美的菜单(jQuery 等)一样好。
但我们也用过jQuery、YUI!和别的。唯!如果这是 JavaScript 驱动的菜单的要求,那么它内置了很棒的辅助功能选项。
- 安德鲁
我喜欢火柴人的 手风琴, ,这取决于您希望它如何表现,这可能会产生很好的效果。
我一直是雅虎(毫不掩饰)的粉丝!用户界面库。 他们有一个很好的菜单栏系统 这很容易实现。出色的跨浏览器支持。
您也可以从其他流行的 Javascript 框架(例如 jQuery)获得类似的东西。