15

私は、構築しているサイトにドロップダウンカスケードメニューを実装しなければならないという不幸な立場にあります。私は、主にCSSベースであり、ネストされたULとLIの単純なセットで機能するSuckerfishスタイルのソリューションを探しています。

Son of Suckerfishは道のりのようですが、マウスを離すとすぐに消えてしまう方法は好きではありません。調整が困難なユーザーは、サイトをナビゲートするのに悪夢を見るでしょう(または単に気にしないでください。これは企業サイトなので、おそらく私が実装したものを何でも使用しなければならない人もいます)。

私が必要とさえ考えていなかったきちんとした機能は大歓迎ですが、私が探している2つの主要な要素は次のとおりです。

  1. ネストされたUL/LI構造を使用したマルチレベル
  2. 追加のJavaScriptによって提供されている場合でも、メニューが「マウスアウト」されたときに消えるまでのわずかな(おそらく構成可能ですか?)遅延。
4

9 に答える 9

8

suckerfish メニューの jQuery 適応である superfish使用することを強くお勧めします。たくさんの機能があり (遅延もその 1 つです)、派手なアニメーション機能を追加し、通常のサッカーフィッシュ メニューに優雅に格下げされます。また、追加のマークアップも必要ありません。

于 2009-01-02T18:47:50.260 に答える
3

jQueryを使用できます。次に例を示します:http ://www.jqueryplugins.com/plugin/47/

于 2008-08-19T07:52:20.547 に答える
1

必要な機能を備えた純粋な CSS ドロップダウン メニューを取得することはできません。ある種の Javascript を使用する必要があります。言及されている JQuery のようなライブラリを使用するか、または onmouseover/out の代わりに onclick を使用するように Suckerfish コードを変更します。

しかし、すべての Javascript ルートに進むことで、あるグループの人々 (「調整が困難なユーザー」) にとっては簡単になり、他のグループ (何らかの理由で Javascript がオフになっている人) にとっては困難になる可能性があります。

いくつかの代替手段を追加することを検討したい場合があります-マウスに慣れている人のためのマウス制御のホバーメニュー。他の人のためのアクセスキーなどによるキーボードベースの制御。

于 2008-08-19T09:38:19.053 に答える
1

Steve Gibson のサイトgrc.comに実装されているソリューションを使用しています。それは私が必要とするすべてを行い、javascript を使用しません。ただし、探している遅延はそこにないため、おそらくそのために Javascript を追加する必要があります。

于 2008-08-25T13:56:13.550 に答える
1

調整の問題の一部は、設計の悪さに起因する場合があります。可能であれば、すべての面が重なるように、かなり大きなボタンを用意してください。理想的には、トップ ナビゲーション ボタンのドロップダウン メニューが (左揃えではなく) その下の中央に表示されるようにします。ドロップダウンのサブメニューも同様のパターンに従います。このレベルのエラー パディングを使用すると、協調性のないユーザーにも対応でき、javascript でプログラミングする手間を省くことができます。

もちろん、すべてのサイトは異なるため、これを代替の「what-if」ソリューションとして提示します.

于 2009-01-02T18:59:13.280 に答える
0

私の最初の推奨事項は、既に作成されたものと同じです - Steve Gibson の CSS Menu。JavaScript を使用せず、クロスプラットフォーム対応であり、実装も比較的簡単です。

それがうまくいかない場合、私の JS ベースの推奨事項はmygosuMenuに行きます。スティーブのメニューを見つける前に、すべてのプロジェクトでかなり長い間使用してきました。高度な設定が可能です。スタイル、構造、およびメニュー コードはすべて独立しています。CSS を介して心ゆくまでスタイルを設定できる基本的な HTML テーブルです。

後者を使用しているサイトが 2 つあります。

于 2009-01-02T19:33:09.623 に答える
0

JavaScript 以外で遅延を追加する方法はわかりませんが、JavaScript を使用する場合は、JavaScript 制御メニューを使用することもできます。

意味的に正しいナビゲーション パターンに従って設定し、JavaScript が存在しないときに通常 (静的など) に表示されるように設定すれば、何を使用しても問題ないはずです。

それはあなたのターゲットオーディエンスについてのすべてです - 誰が大きいですか? JS 障害者または調整が困難なユーザーですか? 後者には優先順位が必要だと思います(パーセンテージ使用でない場合は障害法)。

于 2008-08-25T13:52:01.373 に答える
0

Lee Theobald が言ったように、ドロップダウンには Javascript が必要であり、Jquery は素晴らしい選択です。しかし、アクセシビリティの面では、メニューの素晴らしいリストである「 Listamatic 」と、これがネストされた特別なものを見てください。

于 2008-08-25T13:58:56.287 に答える