EasyUI中ToolTip提示框的简单使用
场景
效果
属性
名称 | 类型 | 描述 | 默认值 |
---|---|---|---|
position | string | 提示框(tooltip)位置。可能的值:'left'、'right'、'top'、'bottom'。 | bottom |
content | string | 提示框(tooltip)内容。 | null |
trackMouse | boolean | 如果设置为 true,提示框(tooltip)会随着鼠标移动。 | false |
deltaX | number | 提示框(tooltip)位置的水平距离。 | 0 |
deltaY | number | 提示框(tooltip)位置的垂直距离。 | 0 |
showEvent | string | 引发提示框(tooltip)出现的事件。 | mouseenter |
hideEvent | string | 引发提示框(tooltip)消失的事件。 | mouseleave |
showDelay | number | 显示提示框(tooltip)的时间延迟。 | 200 |
hideDelay | number | 隐藏提示框(tooltip)的时间延迟。 | 100 |
事件
名称 | 参数 | 描述 |
---|---|---|
onShow | e | 当显示提示框(tooltip)时触发。 |
onHide | e | 当隐藏提示框(tooltip)时触发。 |
onUpdate | content | 当提示框(tooltip)内容更新时触发。 |
onPosition | left,top | 当提示框(tooltip)位置改变时触发。 |
onDestroy | none | 当提示框(tooltip)销毁时触发。 |
方法
名称 | 参数 | 描述 |
---|---|---|
options | none | 返回选项(options)属性(property)。 |
tip | none | 返回提示(tip)对象。 |
arrow | none | 返回箭头(arrow)对象。 |
show | e | 显示提示框(tooltip)。 |
hide | e | 隐藏提示框(tooltip)。 |
update | content | 更新提示框(tooltip)内容。 |
reposition | none | 重置提示框(tooltip)位置。 |
destroy | none | 销毁提示框(tooltip)。 |
实现
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css"><link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css"><script type="text/javascript" src="/easyui/jquery.min.js"></script><script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a>
<a id="dd" href="javascript:void(0)">Click here</a>
<script type="text/javascript">$('#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'});}});
</script>
</body>
</html>
EasyUI中ToolTip提示框的简单使用相关推荐
- echarts中tooltip提示框位置控制
关键代码: position: function(point, params, dom, rect, size) {//其中point为当前鼠标的位置,size中有两个属性:viewSize和cont ...
- EasyUI中Combox组合框的简单使用
场景 效果 用法 从带有预定义结构的 <select> 元素创建组合框(combobox). <select id="cc" class="easyui ...
- EasyUI中Validatebox验证框的简单使用
场景 效果 属性 名称 类型 描述 默认值 required boolean 定义是否字段应被输入. false validType string,array 定义字段的验证类型,比如 email.u ...
- EasyUI中Messager消息框的简单使用
场景 效果 属性 名称 类型 描述 默认值 ok string 确定按钮的文本. Ok cancel string 取消按钮的文本. Cancel 方法 名称 参数 描述 $.messager.sho ...
- EasyUI中Datebox日期框的简单使用
场景 效果 属性 该属性扩展自组合(combo),下面是为日期框(datebox)添加的属性. 名称 类型 描述 默认值 panelWidth number 下拉日历面板的宽度. 180 panelH ...
- echarts隐藏掉一条曲线,并且tooltip提示框中不显示
echarts隐藏掉一条曲线,并且tooltip提示框中不显示 两步走: 1.隐藏掉一条曲线 series: [{name: '...',type: 'line',symbolSize: 0, // ...
- html input tooltip,BootStrap tooltip提示框使用小结
提示框 提示框的基本使用方式为: test message data-original-title可以直接写为title,仍然能正常使用,源码中优先查找前者,前者不存在就会查找title 提示框不提供 ...
- Echarts数据可视化tooltip提示框,开发全解+完美注释
全栈工程师开发手册 (作者:栾鹏) Echarts数据可视化开发代码注释全解 Echarts数据可视化开发参数配置全解 6大公共组件详解(点击进入): title详解. tooltip详解.toolb ...
- Android中MaterialSearchView(搜索框)的简单实用
Android中MaterialSearchView(搜索框)的简单实用 收搜框架有好多,动画效果满炫酷的就是代码太多,没发抽取他的搜索功能,而这个却比较好用些,直接从代码里面抠出来一个简单实现搜索功 ...
最新文章
- jsp中简易版本的图片上传程序
- VS(官方)跨平台开发远程调试教程(远程开发)
- exchange 2010 集线器(hub)外发邮件的配置
- 【Tool】sublime txt的使用
- Codeforces Round #614 (Div. 2) D. Aroma‘s Search 暴力 + 思维
- Java虚拟机(JVM)简介
- 我从Stack Overflow对64,000名开发人员的大规模调查中学到的东西
- eclipse+java+selenium+testNG搭建自动化测试框架
- Java TCP通信概念及实例
- 陕西西咸新区暨沣渭新区泾渭新区网上截图!
- vue-计算属性不能直接修改
- python开发环境规范——pycharm
- vc2005运行库彻底卸载_VC2005运行库-解决方案
- STM32用串口(USB串口)下载程序的方法
- 启动kafka时报错:java.nio.file.FileSystemException,另一个程序正在使用此文件,进程无法访问。
- iphone模拟器上模拟内存警告
- 讲解后台管理系统之列表设计分享
- 十六宫格拼图(A*/IDA*)(曼哈顿距离)
- Manifest merger failed : uses-sdk:minSdkVersion 16 cannot be smaller than version 19 declared in lib
- 我思故我在--(一)
热门文章
- Spring Boot、Spring Cloud、Spring Cloud Alibaba版本关系查询
- zigbee抗干扰matlab仿真,基于Zigbee的扩频通信MATLAB仿真.doc
- 插值法补齐缺失数据_关于数据清洗的常见方式
- c语言汉字属于什么类型_你知道你的身体属于什么类型么?
- CentOS7下安装tomcat8
- 忘记mysql登录密码怎么办
- Jenkins转换成中文(Jenkins汉化)
- webpack 原理图_webpack打包原理
- win7安装python2.7_python学习(3)-win7安装python2.7
- QTextEdit查找某个字符串更换颜色样式