jQuery Mobile テキストを省略せずに表示

jQuery Mobileは、モバイルに最適化したウェブを開発するための JavaScript & CSS フレームワーク。

なかなかにイイ感じになるのだが、初期状態のままでは、ボタンタイトルなどの長い文字列が「…」と省略されてしまう。

省略させたくない場合は、以下のスタイルを上書き。
[code lang=”css”]
<style>
.ui-header .ui-title, /* header */
.ui-footer .ui-title, /* footer */
.ui-btn-inner, /* button */
.ui-li-heading, /* listview heading */
.ui-li .ui-btn-text a.ui-link-inherit, /* listview link */
.ui-li-desc /* listview description */
{
overflow: visible;
white-space: normal;
}
</style>
[/code]
ちなみに JQuery Mobile 1.4 では効かないみたい。


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です