16

ドロップダウンのJavaScriptメニューを探しています。

これは、IE6およびFirefox2でも機能する最もシンプルでエレガントなアクセス可能なメニューである必要があります。ulユーザーがJavaScriptのサポートなしでページを使用できるように、番号のないリスト（）で機能する場合は問題ありません。

どれをお勧めしますか？そのようなメニューのコードはどこにありますか？

4

7 に答える 7

12

jqueryスーパーフィッシュメニューは素晴らしくて使いやすいと思います：

http://users.tpg.com.au/j_birch/plugins/superfish/

Javascriptは必須ではなく、単純な有効なulunorderリストに基づいています。

于 2008-09-19T12:46:19.503 に答える
3

離れたリスト-ドロップダウン

上記のようなcssのみのソリューションを使用するので、JavaScriptが無効になっている場合でも、ユーザーはドロップダウンメニューを取得できます。

于 2008-09-19T12:47:33.200 に答える
2

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();

しかし、これらは使い勝手が悪いことを指摘しておきます。リストを使用して一度にすべてのオプションを表示することをお勧めします。また、選択後に別の場所に移動したり、必要な場所に移動するために別のボタンを押す必要がないことをお勧めします。

上記を使用しないのが最善だと思います（コードを書いたのは私です！）

于 2008-09-19T12:54:34.710 に答える
2

純粋主義者向け: http://www.grc.com/menudemo.htm JavaScript を一切使用せず、pure-css のみ - 事実上すべてのブラウザーで動作します。

少し調整するだけで、派手なメニュー (jQuery など) と同じくらい見栄えがよくなります。

しかし、jQuery、YUI も使用しました。その他。ユイ！JavaScript を利用したメニューの要件である場合、優れたアクセシビリティ オプションが組み込まれています。

-- アンドリュー

于 2008-09-19T12:58:59.317 に答える
2

私はこれを使用します：

http://www.tanfa.co.uk/css/examples/menu/vs7.asp

縦型と横型の両方のフレーバーがあります。

于 2008-09-19T13:06:19.783 に答える
1

私はバッターのアコーディオンが好きです。これは、どのように動作させたいかによって、素晴らしい効果が得られます。

于 2008-09-19T12:52:46.667 に答える
1

私は Yahoo! の (恥ずかしがらずに) ファンです。ユーザー インターフェイス ライブラリ。簡単に実装できる優れたメニューバー システムがあります。優れたクロスブラウザー サポート。

おそらく、jQuery などの他の一般的な Javascript フレームワークからも同様のものを取得できます。

于 2008-09-19T17:18:10.787 に答える