titleタグを使わずにspanタグでツールチップに表示したい文章を入れておきます。
spanタグは非表示にしておいて、マウスオーバーしたときに表示する。
jQueryバージョンもあります。>>>ツールチップ表示をjQueryでオリジナル化
HTMl
<p>ツールチップ表示の<a href="#" class="tooltip"><span>ここにツールチップテキストをいれる</span>デモリンクはここ</a>です。<br /> ツールチップ表示のDEMOぺーじです。ツールチップ表示のDEMOぺーじです。ツールチップ表示のDEMOぺーじです。<br /> ツールチップ表示のDEMOぺーじです。ツールチップ表示のDEMOぺーじです。ツールチップ表示のDEMOぺーじです。</p>
CSS
/* リンクスタイル設定 */ a.tooltip:link{color:#000;} a.tooltip:visited{color:#000;} a.tooltip:hover{color:#FFF; background-color:#690; text-decoration:none; position:relative;} a.tooltip:active{color:#FFF; background-color:#690; text-decoration:none;} /* ツールチップスタイル設定 */ a.tooltip span{ display:none; } a.tooltip:hover span{ display:block; position:absolute; top:25px; left:20px; white-space:nowrap;/* 折り返し無し */ color:#000; text-decoration:none; line-height:1.2; border:#690 solid 2px; background-color:#FFC; padding:5px; }