easyUI tootip组件使用:

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<script src="easyui/jquery.min.js"></script>
<script src="easyui/jquery.easyui.min.js"></script>
<script src="easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="js/test006.js"></script>
<link rel="stylesheet" href="easyui/themes/default/easyui.css">
<link rel="stylesheet" href="easyui/themes/icon.css">
</head> <body style="margin:20px">
<a class="easyui-tooltip" herf="#" title="this is title">hover on</a>
<a href="#" id="box">hover 2 on</a>
<div id="pox" style="border: 1px solid #ccc;width:200px;height:200px">div hover 2 on</div>
</body> </html>
$(function(argument) {
var obj = {
content: '<strong>this is content</strong>', //tooltip显示的内容,支持html语法
// position:'top',//toptip显示的位置;
trackMouse: true, //追踪鼠标位置,如果position是top,跟踪鼠标的时候可能会使位置变成bottom;
// deltaX: 100, //与鼠标x轴方向的偏移
// deltaY: 100,
// showDelay: 1500, //显示的延迟时间
// hideDelay: 1500,
// showEvent:'click',//显示tooltip的事件
// hideEvent:'dblclick',//隐藏tooltip的事件,dblclick-双击隐藏
onShow: function(e) {
console.log('onShow');
console.log($(this).tooltip('options')); //获得options对象
console.log($(this).tooltip('tip')); //获得tip对象
console.log($(this).tooltip('arrow')); //获得arrow对象
$(this).tooltip('hide'); //隐藏
$(this).tooltip('show'); //显示
$(this).tooltip('update', 'this is update content'); //更新content内容;
$(this).tooltip('reposition');
// $(this).tooltip('destroy'); //销毁tooltip对象
},
onHide: function(e) {
console.log('onHide');
},
onUpdate: function(e) {
console.log('onUpdate');
},
onPosition: function(left, top) {
console.log('onPosition');
console.log('left:' + left + ";top:" + top);
},
onDestroy: function(e) {
console.log('onDestroy');
}
};
$('#box').tooltip(obj);
$('#pox').tooltip(obj);
});

easyUI tootip组件使用的更多相关文章

  1. Easyui主要组件用法

    Easyui主要组件用法说明: 1.  combogrid用法 说明:combogrid可提供翻页列表的数据选择并可进行数据的过滤查询(查询的传人参数为q,可在控制器中获取这个参数传过来的值,下面的示 ...

  2. Easyui部分组件讲解

    Easyui部分组件讲解 目  录 1.... Accordion(可折叠标签)... 2 1.1          实例... 2 1.2          参数... 3 2.... DateBo ...

  3. 对easyui datagrid组件的一个小改进

    #对easyui datagrid组件的一个小改进 ##问题 在实际项目中使用datagrid时,受版面限制,有时候表格不能太大,这时候表格里面的内容就不能完全显示,用户需要经常拖动调整列宽才能看完整 ...

  4. easyUI panel组件

    easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. easyUI progressbar组件

    easyUI progressbar组件: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  6. easyUI linkbutton组件

    easyUI linkbutton组件: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  7. easyUI resizable组件使用

    easyUI resizable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  8. easyUI droppable组件使用

    easyUI droppable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  9. easyUI draggable组件使用

    easyUI draggable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

随机推荐

  1. NGUI具有流光效果的UISprite

    之前做过一个流光效果(http://www.cnblogs.com/jietian331/p/4748644.html). 现将其改进一下,与NGUI结合起来,提供一个具有流光效果的组件:UIWalk ...

  2. Struts1、2种如何防止表单重复提交和两者的区别

    使用token指令牌就行了.在进入标签之前的action中通过saveToken方法保存指令牌.在表单提交后的action中判断这个token是否存在,如果存在允许插入,并通过resetToken把t ...

  3. openstack名称发音收集

    MariaDB:    maria['mɛərɪr] Corosync:    coro[kə'roʊ]    sync[sɪŋk] pacemaker:    [ˈpesˌmekɚ] galera: ...

  4. java类集: collection, list , set, map

    都在java.util包里.容器:装各种对象. Collections类 : 集合工具类, 提供了一些静态方法, 方法里的参数是List等. Colection接口,子接口主要有:   Set: 内容 ...

  5. 五、Hive

    一.Hive 1.1 Hive简介 1.2 Hive说明 1.3Hive的体系架构 来自为知笔记(Wiz)

  6. NULL、nil、Nil、NSNull的区别

    标志 值 含义 NULL (void *)0 C指针的字面零值 nil (id)0 Objecve-C对象的字面零值 Nil (Class)0 Objecve-C类的字面零值 NSNull [NSNu ...

  7. tools_list

    http://files.cnblogs.com/files/yansc/ExportQingtaoImage.rar

  8. NSDate常用代码范例

    NSDate常用代码范例 NSDate类用于保存时间值,同时提供了一些方法来处理一些基于秒级别时差(Time Interval)运算和日期之间的早晚比较等. 1. 创建或初始化可用以下方法 用于创建N ...

  9. 微信小程序-未接入app.json错误

    微信小程序建立新项目之后会出现app.json文件未接入错误如下图: 一般是因为在下图添加新项目,项目目录这一列,如果不事先建立一个空的文件夹,直接选择则不会出现quickstartup界面 所以在建 ...

  10. 用DMA直接驱动GPIO,实现GPIO最高输出速率(转)

    源:用DMA直接驱动GPIO,实现GPIO最高输出速率 先上图:STM32F303芯片,72M的主频 可以看到GPIO的达到了14.4M的翻转速率,      再来上代码: RCC_AHBPeriph ...