easyUI tootip组件使用
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组件使用的更多相关文章
- Easyui主要组件用法
Easyui主要组件用法说明: 1. combogrid用法 说明:combogrid可提供翻页列表的数据选择并可进行数据的过滤查询(查询的传人参数为q,可在控制器中获取这个参数传过来的值,下面的示 ...
- Easyui部分组件讲解
Easyui部分组件讲解 目 录 1.... Accordion(可折叠标签)... 2 1.1 实例... 2 1.2 参数... 3 2.... DateBo ...
- 对easyui datagrid组件的一个小改进
#对easyui datagrid组件的一个小改进 ##问题 在实际项目中使用datagrid时,受版面限制,有时候表格不能太大,这时候表格里面的内容就不能完全显示,用户需要经常拖动调整列宽才能看完整 ...
- easyUI panel组件
easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- easyUI progressbar组件
easyUI progressbar组件: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- easyUI linkbutton组件
easyUI linkbutton组件: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- easyUI resizable组件使用
easyUI resizable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- easyUI droppable组件使用
easyUI droppable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- easyUI draggable组件使用
easyUI draggable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
随机推荐
- Preface
I'd never given much thought to how I would die — 我从来没有想过我会怎么样死 much thought 仔细思考 我从未仔细思考过,我将如何死去 th ...
- this.button1.Click += new System.EventHandler(this.button1_Click);
在这个程序里,这里的修改是为了更好理解,当然这种写法是语法错误的. 下面我们对其进行分析: 首先,观察“=”右面的表达式. new System.EventHandler(this.button1_C ...
- ecos的mvcl
m 数据模型抽象层 v 视图 c 控制器 l 业务逻辑 mvc与mvcl区别 mvc中的m是mvcl中m+l
- C语言常见命名规范
C语言常见命名规范 1 常见命名规则 比较著名的命名规则首推匈牙利命名法,这种命名方法是由Microsoft程序员查尔斯·西蒙尼(Charles Simonyi) 提出的.其主要思想是“在变量和函 ...
- EF 报【序列包含一个以上的元素】解决办法
1.检查模型是否存在重复的字段,eg: public class AggregateRoot { public System.Guid Guid { get; set; } } public part ...
- POJ 2653 Pick-up sticks
计算几何,判断线段相交 注意题目中的一句话:You may assume that there are no more than 1000 top sticks. 我认为是没有描述清楚的,如果不是每次 ...
- SQL 复习二（数据查询语言）
1.1 数据查询语言 DQL就是数据查询语言,数据库执行DQL语句不会对数据进行改变,而是让数据库发送结果集给客户端. 语法: SELECT selection_list /*要查询的列名称*/ FR ...
- iOS开发之圆角指定
如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某几个角(小于4)为圆角而别的不变时 ...
- set multiset 集合实现众数的统计
众数问题 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 所谓众数,就是对于给定的含有N个元素的多重集合,每个元素在S中出现次数最多的成为该元素的重数, 多重集合S重 ...
- memcache数据组织
转自:原链接 使用命令 set(key, value) 向 memcached 插入一条数据, memcached 内部是如何组织数据呢 一 把数据组装成 item memcached 接受到客户端的 ...