jQuery EasyUI 教學-Tooltip（提示框）

上一篇文章給大家介紹了jQuery EasyUI 教學-ProgressBar（進度條），這款組件前端開發人員在工作中普遍能用到，接下來給大家介紹這款jQuery-Tooltip（提示框）組件，在工作過程中也是非常有用的。

本文給大家詳細講述jQuery-Tooltip（提示框）的使用案例，並透過一步一步的程式碼實現過程，不僅讓您掌握Tooltip的實現，還提升您在前端開發工作的程式設計興趣和水平。

使用$.fn.tooltip.defaults重寫預設值物件。 （譯者註：1.3.3版新增的plugin）

當使用者將滑鼠移到元素上的時候，將會顯示一個訊息提示框。提示框的內容可以是頁面中任何一個HTML元素或透過Ajax傳送後台請求以取得提示框內容。

使用案例：

建立提示框

透過標籤和Javascript兩種方法來建立提示框。

1、透過標籤建立提示框，為元素增加一個」easyui-tooltip」的類別名，無需任何Javascript程式碼。

<a href=”#” title=”This is the tooltip message.” class=”easyui-tooltip”>Hover me</a>

2. 透過Javascript建立提示框。

<a id=”dd” href=”javascript:void(0)”>Click here</a>

$(‘#dd’).tooltip({
position: ‘right’,
content: ‘<span style=”color:#fff”>This is the tooltip message.</span>’,
onShow: function(){
$(this).tooltip(‘tip’).css({
backgroundColor: ‘#666′,
borderColor: ‘#666′
});
}
});

屬性：

事件：

方法：

方法：

🎜 網以上的內容提示圖. php.cn）！ 🎜🎜🎜🎜🎜