Class jQuery.imui.imuiTooltip

Constructor

imuiTooltip ( [Object options] ) Static
title属性をツールチップで表示します。
title属性の値はエスケープしません。改行をしたい場合は<br>タグを埋め込んでください。
ツールチップを表示する要素のclass属性に "imui-tooltip-top" あるいは "imui-tooltip-bottom" を指定することでも同様のツールチップを表示することができます。
imui-tooltip-top を指定した場合は要素の上側に、imui-tooltip-bottom を指定した場合は要素の下側にツールチップを表示します。
注意事項
  • ダイアログ内の要素など親要素にz-indexが指定されている要素にツールチップを出したい場合は、それより大きい値を指定してください。
Parameters
options : Object
Optional
オプション
options.tooltipLocation : String
OptionalDefault: top
ツールチップを表示する位置を指定します
"top"または"bottom"を指定してください
options.maxWidth : String
OptionalDefault: auto
ツールチップの最大横幅をpxで指定します
options.tooltipTitle : String
Optional
ツールチップに表示したい文字列を指定します
指定した文字列はエスケープしません
options.zIndex : String
Optional
ツールチップのz-indexを指定します
<!-- imuiTooltip を使わず、class属性とtitle属性を指定してでツールチップを利用する例 -->
<button class="imui-button imui-tooltip-bottom" title="title属性の値がツールチップに出力されます">ここをマウスオーバしてください</button>
<!-- imuiTooltipでツールチップを利用する例 -->
<button id="sampleId" class="imui-button" >ここをマウスオーバしてください</button>
<script type="text/javascript">
 $('#sampleId').imuiTooltip({
   tooltipLocation:'bottom',
   maxWidth:'150px',
   tooltipTitle:'tooltipTitle オプションの値が表示されます'
 });
</script>
<!-- z-index を指定する例 -->
<textarea id="sampleId" title="z-index の確認(option の zIndex を指定)" >ここをマウスオーバしてください</textarea>
<script type="text/javascript">
  $('#sampleId').imuiTooltip({zIndex:1001});
</script>