たとえば、小さな色付きの長方形とその横にあるテキスト ラベルを含む単純な凡例を表示できる JS/jQuery ウィジェットはありますか?
この特定のケースでは、凡例はインライン jQuery UI 日付ピッカー ウィジェットのさまざまな色コードの背後にある意味を示します。これは、ユーザーによる複数の選択を可能にし、特定の日に異なる色を表示するようにカスタマイズされます。
実際、私が必要としているのは、このページのフッターにある SO サイトのリストとまったく同じです (ピッカーの横に垂直にリストされているのが理想的です)。したがって、既成の解決策がない場合は、このページのソースを見てみることにします。
それを StackOverflow クルーに渡す必要があります。伝説を作成する彼らの方法はかなり巧妙です。基本的に、イメージや div の代わりに文字 ■ (ASCII 254) を使用します。フォント サイズと色のプロパティでスタイル設定されたスパンに挿入します。その隣には、スタイル付きのアンカー タグがあります。すすいで繰り返します。
それについて特に賢いのは、すべてが divにインラインで収まり、ベースラインに並んでいることです! もう一度言わせてください。それはベースライン上に並んでいます! そのため、画像のオフセットなどに差異はありません。これを簡単に作成した UI エンジニアに敬意を表します。それに注意を喚起してくれてありがとう。
編集: ASCII 254 は正しくありません。によって得られる実際の値"■".charCodeAt(0)は 9632 で、おそらく Unicode のフレーバーです。見た目も形も同じですが、価値が違います。