RIAトピックス
リッチクライアント/RIAを主テーマに取り扱います。Flex、Ajax、AIR、Silverlight、JavaFX、etc。
スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

テキストボックスで表示しきれないテキストを表示するスタイルシート
[CSS]テキストボックスで表示しきれないテキストを表示するスタイルシート 【コリスより】
http://coliss.com/articles/build-websites/operation/css/css-text-overflow.html

文字が画面端で見えなくなってしまったり、デザインの関係で文字をそこで切ってしまいたいという事はよくあると思います。
そんな時に使用できるのが今回紹介するスタイルシートです。

「text-overflow:ellipsis;」と指定することで、テキストボックスに入りきらない部分は「...」と表示されます。(firefox3.6.3では未実装)
そして、spanタグのhoverでカーソルが上に来たときに全文が表示するように指定しているようです。

ユーザビリティとデザインを両立するのは難しいですが、このようにマウスオーバー時の挙動を変化させる事などで改善は可能です。
どちらかをとると言う選択を行う前に、両立を行う手段を考えてみてはいかがでしょうか?

K.Y
スポンサーサイト

テーマ:システム開発 - ジャンル:コンピュータ

コメント
この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
この記事へのトラックバック
copyright © 2005 RIAトピックス all rights reserved.
Powered by FC2ブログ.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。