datagrid鼠标悬浮提示
/**
* 扩展两个方法
*/
$.extend($.fn.datagrid.methods, {
/**
* 开打提示功能
* @param {} jq
* @param {} params 提示消息框的样式
* @return {}
*/
doCellTip : function(jq, params) {
function showTip(data, td, e) {
if ($(td).text() == "")
return;
data.tooltip.text($(td).text()).css({
top : (e.pageY + 10) + 'px',
left : (e.pageX + 20) + 'px',
'z-index' : $.fn.window.defaults.zIndex,
display : 'block'
});
};
return jq.each(function() {
var grid = $(this);
var options = $(this).data('datagrid');
if (!options.tooltip) {
var panel = grid.datagrid('getPanel').panel('panel');
var defaultCls = {
'border' : '1px solid #333',
'padding' : '1px',
'color' : '#333',
'background' : '#f7f5d1',
'position' : 'absolute',
'max-width' : '200px',
'border-radius' : '4px',
'-moz-border-radius' : '4px',
'-webkit-border-radius' : '4px',
'display' : 'none'
}
var tooltip = $("<div id='celltip'></div>").appendTo('body');
tooltip.css($.extend({}, defaultCls, params.cls));
options.tooltip = tooltip;
panel.find('.datagrid-body').each(function() {
var delegateEle = $(this).find('> div.datagrid-body-inner').length
? $(this).find('> div.datagrid-body-inner')[0]
: this;
$(delegateEle).undelegate('td', 'mouseover').undelegate(
'td', 'mouseout').undelegate('td', 'mousemove')
.delegate('td', {
'mouseover' : function(e) {
if (params.delay) {
if (options.tipDelayTime)
clearTimeout(options.tipDelayTime);
var that = this;
options.tipDelayTime = setTimeout(
function() {
showTip(options, that, e);
}, params.delay);
} else {
showTip(options, this, e);
}
},
'mouseout' : function(e) {
if (options.tipDelayTime)
clearTimeout(options.tipDelayTime);
options.tooltip.css({
'display' : 'none'
});
},
'mousemove' : function(e) {
var that = this;
if (options.tipDelayTime) {
clearTimeout(options.tipDelayTime);
options.tipDelayTime = setTimeout(
function() {
showTip(options, that, e);
}, params.delay);
} else {
showTip(options, that, e);
}
}
});
});
}
});
},
/**
* 关闭消息提示功能
* @param {} jq
* @return {}
*/
cancelCellTip : function(jq) {
return jq.each(function() {
var data = $(this).data('datagrid');
if (data.tooltip) {
data.tooltip.remove();
data.tooltip = null;
var panel = $(this).datagrid('getPanel').panel('panel');
panel.find('.datagrid-body').undelegate('td',
'mouseover').undelegate('td', 'mouseout')
.undelegate('td', 'mousemove')
}
if (data.tipDelayTime) {
clearTimeout(data.tipDelayTime);
data.tipDelayTime = null;
}
});
}
});
function doCellTip(){
$('#mainGrid').datagrid('doCellTip',{'max-width':'100px'});
}
function cancelCellTip(){
$('#mainGrid').datagrid('cancelCellTip');
}
function doCellTip(){
$('#mainGrid').datagrid('doCellTip',{'max-width':'100px'});
}
function cancelCellTip(){
$('#mainGrid').datagrid('cancelCellTip');
}
datagrid鼠标悬浮提示的更多相关文章
- IntelliJ设置鼠标悬浮提示和修改快捷键
IntelliJ设置鼠标悬浮提示和修改快捷键 设置鼠标悬浮提示 修改快捷键 进入设置菜单 删除原来的快捷键(注:你可以选择保留原来的快捷键,同时使用两个快捷键) Good Luck
- easyUi datagrid鼠标经过提示单元格内容
此文章是基于 EasyUI+Knockout实现经典表单的查看.编辑 一. jquery.cellTip.js /** * 扩展两个方法 */ using('datagrid', function() ...
- IntelliJ IDEA设置鼠标悬浮提示
测试代码; public interface MyInterface { /** * 我是接口方法的注释 * @param num1 我是接口方法入参的注释 * @return 我是接口方法返回值的注 ...
- 解决echarts 鼠标悬浮提示 文本提示问题。
参考文章:https://www.jianshu.com/p/aa585c304660 官方文章样式详解:http://echarts.baidu.com/option.html#tooltip.fo ...
- IntelliJ IDEA 2017.3尚硅谷-----鼠标悬浮提示
建议不会的直接百度取消设置
- Android Studio移动鼠标显示悬浮提示的设置方法
欢迎和大家交流技术相关问题: 邮箱: jiangxinnju@163.com 博客园地址: http://www.cnblogs.com/jiangxinnju GitHub地址: https://g ...
- 使用layer.tips实现鼠标悬浮时触发事件提示消息实现
代码: <body> <label id="test" onmouseover="show('test')"> 你瞅啥!?过来试试! & ...
- echarts —— tooltip 鼠标悬浮显示提示框属性
最近一直在使用echarts,当然也被其中的各种属性整的头大,记录一下其中遇到的问题. tooltip:鼠标悬浮时显示的提示框. 今天想要记录的是[自定义提示框的内容],如下图,鼠标悬浮时提示框内显示 ...
- css实现鼠标悬浮后的提示效果
一.概述 很多时候网站中需要在鼠标划过小图标时,悬浮出提示性的文字.比如下图: 鼠标悬浮后的效果 这种效果可以使用css中的伪类hover来实现.但有时候搞不清两个元素的嵌套关系.使用了hover却没 ...
随机推荐
- Unable to create requested service org.hibernate.cache.spi.RegionFactory
hibernate 4.3.11+struts2.3.28.1+spring 4.2.5,在搭框架的时候,报的这个错误: Unable to create requested service org. ...
- poj 2388 insert sorting
/** \brief poj 2388 insert sorting 2015 6 12 * * \param * \param * \return * */ #include <iostrea ...
- pselect 和 select
pselect函数是由POSIX发明的,如今许多Unix变种都支持它. #include <sys/select.h> #include <signal.h> #include ...
- Cookie 获取访问时间
服务器将客户端需要缓存的数据,发送到客户端,客户端保存在本地的这些缓存数据就是Cookie.区别于Session. 获取用户访问时间代码: response.setCharacterEncodin ...
- JDBC 滚动和分页
public class ScrollTest { /** * @param args * @throws SQLException */ public ...
- iOS 全屏侧滑/UIScrollView/UISlider间滑动冲突
代码地址如下:http://www.demodashi.com/demo/13848.html 效果预览 一.前期准备 有一个支持全屏侧滑返回的视图控制器ViewController,ViewCont ...
- index.js
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- Objective-C的内存管理(一)黄金法则的理解
转自:http://blog.csdn.net/lonelyroamer/article/details/7666851 一.内存管理黄金法则: The basic rule to apple is ...
- visual studio 2013 触发挂起事件
在 VS2013 中调试 winddows phone 或者 win rt 程序的时候,需要手动触发 “挂起” 事件. 如果找不到这个按钮: 1.打开菜单栏中的 “自定义” 对话框: 2.选择调试位置 ...
- [linux]signal函数不起作用
#include "apue.h" #include <sys/wait.h> static void sig_int(int); /* our signal-catc ...