1

私は JavaScript と Web ベースのプログラミングに少し慣れていませんが、私が取り組んでいるお気に入りのプロジェクトでは、見栄えの悪いラジオ ボタンを、ラジオ ボタンと同じように機能する実際のボタン セレクターに置き換えることで、大きなメリットが得られるでしょう。

写真は百聞は一見にしかずですが、私の評判が上がるまで画像を投稿できないようです。

水平ラジオ ボタン リストは、選択可能な「円」が前に付いた、水平方向の行に列挙されたテキスト項目のリストです。項目が 1 つ選択されると、その前にある小さな「円」が塗りつぶされます。リスト内の項目は一度に 1 つだけ選択できます。

水平ボタン セレクター リストは、ボタンを水平方向にグループ化したもので、各ボタンの中央にテキストが表示され、選択する項目を表します。アイテムが中央にあるボタンを選択すると、ボタンの色がなんとなく変わり、選択されたアイテムであることを示します。グループ内で一度に選択できるボタンは 1 つだけです。

ラジオ ボタン選択に対するボタン選択の利点は、タブレットおよびタッチ スクリーンのユーザーが、水平ラジオ ボタン リストではなく水平ボタン セレクター リストで項目を選択する方が簡単であり、より視覚的に魅力的であることです。

垂直ラジオ ボタンと水平ラジオ ボタンの作成方法を理解できましたが、セレクタ ボタンのアイデアを拡張して実際のボタンに変えたいと考えています。誰でもこれの出発点を提供できますか? 選択が必要な「トピック」が 30 を超えており、1 つの「トピック」に対して最大 20 のアイテムを選択できるため、コーディングの量をできるだけ少なくしたいと考えています。

ありがとう!

4

2 に答える 2

1

Twitter Bootstrap はもうチェックしましたか? これはあなたが探しているものかもしれません:

http://getbootstrap.com/2.3.2/javascript.html#buttons

タッチ デバイス用に最適化された新しいバージョンもあります。

http://getbootstrap.com/javascript/#buttons

于 2013-10-18T16:10:20.217 に答える
0

jQuery UI を調べると、上記の水平ラジオ ボタン セレクター リストが次のように機能します。

http://jqueryui.com/button/#radio

于 2013-10-18T16:22:37.747 に答える