http://xueyuan.lanqiao.org
jQuery-EasyUI基础教程之Tooltip提示框
课程目标
?
掌握Tooltip的使用方法
Tooltip Tooltip简介
当用户将鼠标移动到元素上的时候,将会显示一个消息提示框。提示框的内容可以是页面中任何一个HTML元素或者通过Ajax发送后台请求以获取提示框内容。效果如图:
开发Tooltip程序
1. Hover me 只需要简单的给a标签添加一个指定的class样式即有提示框的效果。效果如下图:
Tooltip常用属性 属性名 属性值类型 描述 默认值 position string 消息框位置。可用值有:bottom http://xueyuan.lanqiao.org
\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 参考jQuery EasyUI的API。 代码如下: 1. 2. 3. 4. $('#dd').tooltip({ position: 'right', trackMouse:true, content: '