學習要點
- 調用tooltip()方法
- 修改tooltip()樣式
- tooltip() 方法的屬性
- tooltip()方法的事件
- tooltip()使用on
工具提示他徹底擴展了HTML中的title屬性，讓提示更加豐富，更加可以控制，全面提升用戶體驗。
調用tooltip() 方法
在調用tooltip()方法之前,首先要對元素設置相應的title屬性
<input type="text" name="user" class="text" id="user" title="請輸入賬號,不小于2位!">
$("#user").tooltip();
修改tooltip()樣式
//直接替換掉里面的類即可
.ul-tooltip{
color:red;
}
tooltip()方法的屬性
對話框有兩種形式.
1.tooltip(options) options是以對象鍵值對的形式傳參，每個鍵值對表示一個選項
2.tooltip('action',param) action是操作對話框方法的字符串,param是options的某個選項
- disabled 設置為true將禁止顯示工具提示.
- content 設置title內容
- items 設置顯示器限定范圍
- tooltipClass 引入class形式的css樣式
$("[title]").tooltip({
disabled :false,
content:"改變文字",
items:"input",
tooltipClass:"reg_class"
})
position位置
$("#user").tooltip({
position:{
my: "left center",
at: 'right+5center'
}
})
my是以目標左下角為基準,at是以my為基準
動畫顯示的方法
$("#user").tooltip({
show:true,
hide:false
})
//默認就是淡入淡出
