码迷,mamicode.com
首页 > 其他好文 > 详细

EasyUI 学习(1)-Tooltip(提示框)

时间:2017-09-30 17:56:44      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:fun   click   sage   hover   对象   方法   rip   func   javascrip   

一、创建组件

Tooltip不依赖其他组件

1.使用class加载

<a href="#" class="easyui-tooltip" title="这是一个提示信息">Hover me</a>

2.使用js加载

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

  选择创建,方法使用格式;

    1. $(‘#dd‘).tooltip({
    2. position: ‘right‘,
    3. content: ‘<span style="color:#fff">This is the tooltip message.</span>‘,
    4. onShow: function(){
    5. $(this).tooltip(‘tip‘).css({
    6. backgroundColor: ‘#666‘,
    7. borderColor: ‘#666‘
    8. });
    9. }
    10. });

 

属性

属性名属性值类型描述默认值
position string 消息框位置。可用值有:"left","right","top","bottom" bottom
content string 消息框内容。 null
trackMouse boolean 为true时,允许提示框跟着鼠标移动。 false
deltaX number 水平方向提示框的位置。 0
deltaY number 垂直方向提示框的位置。 0
showEvent string 当激发什么事件的时候显示提示框。 mouseenter
hideEvent string 当激发什么事件的时候隐藏提示框。 mouseleave
showDelay number 延时多少秒显示提示框。 200
hideDelay number 延时多少秒隐藏提示框。 100

 

事件

 

事件名称事件参数描述
onShow e 在显示提示框的时候触发。
onHide e 在隐藏提示框的时候触发。
onUpdate content 在提示框内容更新的时候触发。
onPosition left,top 在提示框位置改变的时候触发。
onDestroy none 在提示框被销毁的时候触发。

方法

 

方法名方法参数描述
options none 返回控件属性对象。
tip none 返回tip元素对象。
arrow none 返回箭头元素对象。
show e 显示提示框。
hide e 隐藏提示框。
update content 更新提示框内容。
reposition none 重置提示框位置。
destroy none 销毁提示框。

 

EasyUI 学习(1)-Tooltip(提示框)

标签:fun   click   sage   hover   对象   方法   rip   func   javascrip   

原文地址:http://www.cnblogs.com/m5n7xiao/p/7615418.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!