HTMLで、 属性名にtitleを指定すると、ツールチップが表示される。
しかし、これにはブラウザによって表示時間が決まっており、IEで6秒、Chromeで10秒、FF,Operaでは無期限だ。
FFやOperaは カーソルを要素上から外すまで消えないのでかまわないのだが、IEの6秒は短い。Chromeも絶妙な長さで、なぜ消すのかが分からない。
そこで、無理矢理消えない風にするjavascriptをちゃちゃっと書いてみた。
これを、headの一番下か、bodyのどこかに貼り付ければOKだ。
<script type="text/javascript"> jQuery(function($,d){d=$('<div />').css({position:"absolute",display:"none",padding:"1px 4px" ,border:"solid 1px #767676",borderRadius:"3px",background:"linear-gradient(#FFF,#E4E5F0)", fontSize:"12px",fontFamily:"Meiryo,arial,\"Hiragino Kaku Gothic ProN\",sans-serif",color: "#575757"});$("*").hover(function(e){var t=$(this),a=this.title;if(a){t.attr("title","").data ("title",a);d.text(a).css({top:e.pageY+2,left:e.pageX+8,display:"block"})}},function(e){var t =$(this),a=t.data("title");d.text("").hide();a!==undefined&&t.attr("title",a).data("title","" )});d.appendTo("body")})</script>