easyUI 鼠标悬停显示内容

当用户移动鼠标指针在某个元素上时,出现提示信息窗口用来显示额外信息。提示内容可以包含任何来自页面的或者通过 ajax 生成的 html 元素。

1、从标记创建提示框(Tooltip),添加 'easyui-tooltip' class 到元素,不需要任何的 javascript 代码。


Hover me

2、使用 javascript 创建提示框(Tooltip)。
    $('#dd').tooltip({
        position: 'right',
        content: 'This is the tooltip message.',
        onShow: function(){
    		$(this).tooltip('tip').css({
    			backgroundColor: '#666',
    			borderColor: '#666'
    		});
        }
    });

属性


名称 类型 描述 默认值
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


你可能感兴趣的:(easy-ui)