jqueryui的Tooltip使用方法

http://api.jqueryui.com/tooltip/#option-position，詳細使用方法。

http://jqueryui.com/tooltip/，DEMO。

content使用

$( ".selector" ).tooltip({ content: "Awesome title!" });//div及相關標簽使用樣式，鼠標放上去時顯示"Awesome title!"，例如：<div class="selector">test</div>

初始化后設置或獲取內容

// getter

?

var content = $( ".selector" ).tooltip( "option", "content" );

// setter

?

$( ".selector" ).tooltip( "option", "content", "Awesome title!" );

items

調用時默認獲取Title的屬性，例如<div title="test"></div>，默認顯示"test"。

也可以設置其它值，$( ".selector" ).tooltip({ items: "img[alt]" });//獲取圖片的alt屬性.

獲取不同的屬性，事例可以參考:http://jqueryui.com/tooltip/#custom-content

初始化后設置或獲取內容

// getter

var items = $( ".selector" ).tooltip( "option", "items" );

?

// setter

$( ".selector" ).tooltip( "option", "items", "img[alt]" );

?

position設置顯示位置

$( ".selector" ).tooltip({ position: { my: "left+15 center", at: "right center" } });

設置或獲取位置信息

// getter

var position = $( ".selector" ).tooltip( "option", "position" );

// setter

$( ".selector" ).tooltip( "option", "position", { my: "left+15 center", at: "right center" } );

tooltipClass顯示的樣式可以改變

$( ".selector" ).tooltip({ tooltipClass: "custom-tooltip-styling" });

設置或獲取顯示的樣式信息

// getter

var tooltipClass = $( ".selector" ).tooltip( "option", "tooltipClass" );

// setter

$( ".selector" ).tooltip( "option", "tooltipClass", "custom-tooltip-styling" );