REDLINE MAGAZINE | IEでツールチップ内を改行する。REDLINE MAGAZINEトップページへ

すべてのエントリを見る

IEでツールチップ内を改行する。

今日気づいた小ネタ。

画像の代替テキストとしてalt属性、補助的な説明を加えるのにtitle属性を使用する。たまたまtitle属性の途中で改行したままIE6でプレビューすると・・・ツールチップが改行されていた。こんな感じ↓

サンプル画像


title内でそのまま改行。

<p><img src="hoge.gif" alt="サンプル画像" title="titleのツールチップを
改行できるみたい。" /></p>

もしくは改行コードを入れて、こんな感じとか。

<p><img src="hoge.gif" alt="サンプル画像" title="titleのツールチップを&#13;&#10;改行できるみたい。" /></p>

気になったので各ブラウザで検証してみた。
・IE6では改行される。IE7(standalone版)でも改行される。
・Firefoxでは半角の空白が入るだけで改行はされない。
・NNでは改行部分が文字化け・・・。
・OperaではFFと同じく改行部分に半角の空白が入る。

うむ。IEだけの特殊な解釈らしい。。。(´・ω・`)ガッカリ・・・
alt内で改行してもtitleがなければ同じような表示になる。

ちなみにソース内で改行する代わりに、改行コード「&#13;&#10;」とか入れてもIEだと同じく改行されて表示される模様。その他のブラウザについては上記の通り使えない・・・。

<< ロリポップのエラーページ設定が簡単に。 | Ajaxでポップアップ >>

トラックバック

このエントリーのトラックバックURL:
http://redline.hippy.jp/cgi/mt/mt-tb.cgi/75

コメント (2)

前に外注のお仕事で使ったら、「変な記号が入ってるので消しておいてください」と言われました。(´;ω;`)
それ以来、仕事では使ってません…。どうなんでしょうね。

>あやーんさん、こんばんわ。

うん。ブラウザによって文字化けする時点で私的には「仕事には使えない」認定です・・・。NN捨てていいよーみたいな案件ならいいと思うんですが、まぁ捨てていいと言われる事はないですわな・・・。

でも、たまにこうやって偶然見つけたブラウザの独自解釈ネタって結構楽しかったりします(w
たいがいIE限定だったりしてあまり使えないんだけど・・・。




※コメント欄に「<」「>」等を含むソースを記載する場合は実体参照に変換してください。

このページの一番上へ

その他の情報など

最近のコメント

PHP オブジェクト指向の勉強
  • Red - 2010.01.08
  • hogepage - 2010.01.21
  • Red - 2010.01.22
  • - 2011.11.27
  • houseiii - 2011.11.27
Fireworks トリミング画像を一括書出 CS4編
  • Iper - 2009.06.27
  • Red - 2009.06.27
  • mala - 2011.11.17
  • Red - 2011.11.18
jQueryでボックスを上下左右中央に簡単配置
overflow を使用したボックス背景のこと
  • - 2007.12.13
  • Red - 2007.12.13
  • - 2007.12.13
  • Red - 2007.12.13
  • hj - 2011.09.23
IE6 → 透過PNG+overflow=混ぜるな危険(追記有)

メッセージを送る

こちらのメッセージ送信フォームは閉鎖させて頂きました。
御用の方は新しい方のブログ にコメント頂くか、 連絡用のフォーム もありますので、そちらからご連絡ください。