1441251888 javascriptでボタンを順番に表示させ、innerHTMLで labelArray[i]の文字をいれています。

そこでlabelArrayの文字が長い場合、ボタンサイズが固定されているので、自動で文字が改行
されてしまいボタンサイズが縦に長くなってしまいます。
あくまで、ボタンサイズを縦、横固定して、文字をボタン内で自動で縮小させて表示させることは可能なのでしょうか?



//順番に6個の選択肢を順番に表示させる
for ( var i = 0; i < 6; i++ ) {
var b = document.createElement("button");
b.innerHTML = labelArray[i]; //6個のボタンを順番に表示させる
b.onclick = button_clickHandler;
$("buttons").appendChild(b);

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2015/09/03 12:44:48
  • 終了:2015/09/10 12:45:04

回答(0件)

回答はまだありません

  • id:a-kuma3
    高さを固定にして、はみ出した部分を見せなくする、ということはできますが、文字を自動で小さくするということはできません。
  • id:kajironpu
    なるほど、そういうことはできないのですね。ボタンを大きめにつくっておくしかなさそうですね
    ありがとうございました。
  • id:a-kuma3
    ボタンを大きめに作れるなら、それに越したことはないと思います。

    自分では試してないですけど、スクリプトでそういうことをやっちゃおう、と考えた人達がいるようです。
    http://kwski.net/jquery/1087/
  • id:kajironpu
    a-Kuma3 さん、どうもありがとうございます。Jqueryでできそうですね! 是非参考にして試してみたいと思います。
  • id:Lhankor_Mhy
    作ったことあります。最近の環境では動作確認してないですが……
    http://realtor-readyabooks.hatenablog.com/entry/20110717/1310914159
  • id:kajironpu
    Lhankor_Mhy さん、ありがとうございます。Firefoxメインなので使えそうですね。ご紹介ありがとうございました。
  • id:kajironpu
    Lhankor_Mhy さん、教えて下さい。
    rows: ボックス内の行数を指定します。の具体的なやり方を教えてください。
    CSSの内部で指定するにはどうしたらいいのでしょうか?

    オリジナルのCSSはこちらになっています。
    できれは、このボタンをそのまま使用して、
    2行からはみ出る場合は、全体に縮小をかけたいのです。


    /*----ボタン----*/
    button {
    font:30px/1.6 Arial, Helvetica, sans-serif;
    background: #E0FFFF;
    border: 1px solid Blue;
    border-radius: 9px;
    color: #111;
    width: 350px;
    padding: 5px 0;
    }

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません