SELECTのプルダウンの長さの調整

困っております。。ご存じの方ぜひ教えて頂けたらと思います。


HTMLのSELECTタグでプルダウンを作成しています。
OPTIONで指定しているリストは１００件ほどあります。
この状態で▼を押してリストを表示すると、
縦が長すぎで、画面の外に飛び出る場合があります。
こうなると、スクロールバーもつまむことができないので
目的のものが選択できないことがあります。
プルダウンの表示長さを調節することはできませんでしょうか？

なお、SELECT以外の代替え案は勝手ながらご遠慮願います。
よろしくお願いしますm(_ _)m

No.3 ベストアンサー 回答者： taloo 回答日時： 2009/07/23 11:09

> 縦が長すぎで、画面の外に飛び出る場合があります。

・・・ブラウザのバグと思います。
参考に、OSと、ブラウザの種類とバージョンを教えて戴けないでしょうか。
（Safari3.0にはブックマークが画面外に表示されて選択できなくなるバグがありましたが)

ネットブックのような画面が小さなパソコンでは、
都道府県（47項目）を表示するだけで画面サイズを超えますので、
そういうブラウザでは閲覧できなくなってしまいますね。
（IE7ではセレクトフィールドのプルダウンメニューにスクロールバーが表示されました)

> プルダウンの表示長さを調節することはできませんでしょうか？
残念ながらそういう方法はありません。

ブラウザベンダーに連絡して、バグを修正してもらうのを待つか、
代替案として<select size="">を指定したり、
<optgroup>で入れ子にしていくとか、
JavaScriptのフローティングウインドウ（ポップアップウインドウ）で擬似的にプルダウンメニューをつけるくらいしかないと思います。


横幅については

<option value="1" label="ほげ">あいうえおあいうえお・・・</option>

という、短く表示する方法もありますが、ブラウザが対応していない可能性の方が高いです。
（この例では「ほげ」が表示される・・・はず）

この回答へのお礼

ご回答いただきましてありがとうございます。
ブラウザはchromeです。
JavaScriptの方法を試してみたいと思います。
ありがとうございます。

お礼日時：2009/07/23 16:12

No.2 回答者： salonpath 回答日時： 2009/07/23 10:08

縦の長さってかいてありますね、すみません。

スクロールバーがつまめないという表現から横の長さもそうとうなんだろうな、と勘違いしてしまったようです。

No.1 回答者： salonpath 回答日時： 2009/07/23 09:41

長さって縦ですか？横ですか？

行数なら<select size="5"> で5行に。
横の長さならcssで、select{width:200px;}で200pxになります。

この回答へのお礼

早速ご回答ありがとうございます！

size=5を試してみましたが、
プルダウン形式ではなく、リスト形式になってしまうようです。
▼をクリックしたときに５件だけ表示されたら
うれしいのですが・・・

お礼日時：2009/07/23 12:22