神马文学网extjs基础-Tooltips与QuickTips
来源：百度文库 编辑：神马文学网 时间：2024/04/30 05:47:11
ExtJs是通过Ext.ToolTip和Ext.QuickTips两个组件来实现浮动提示功能的。
QuickTips代码示例：只需要加入Ext.QuickTips.init(); 就可以在html页面中使用。html页面 可以通过：
我们可以看到下面的效果：
你也可以自定义这些QuickTips的属性：
Ext.apply(Ext.QuickTips.getQuickTip(), {
//maxWidth: 200,
//minWidth: 100,
//showDelay: 50,
//trackMouse: true,
//hideDelay: true,
//closable: true,
//autoHide: false,
//draggable: true,
dismissDelay: 0
});
Ext.ToolTip代码：
new Ext.ToolTip({
target: 'tip1',
html: 'test tooltip'
});
在html页面中加入：11 就可以看到下面的效果：
可以通过ToolTip设置图层自动ajax加载页面，代码：
new Ext.ToolTip({
target: 'ajax-tip',
width: 200,
autoLoad: {url: 'test/1.jsp'},
});
在html页面中加入：ajaxtip 就可以看到下面的效果：
打开的层可以关闭，代码：
new Ext.ToolTip({
target: 'close-tip',
html: 'test close',
title: 'test',
autoHide: false,
closable: true,
draggable:true
});
在html页面中加入： 就可以看到下面的效果：
打开的层随鼠标移动，代码：
new Ext.ToolTip({
target: 'track-tip',
title: 'Mouse Track',
width:200,
html: 'This tip will follow the mouse while it is over the element',
trackMouse:true,
dismissDelay: 15000
});
在html页面中加入:tracktip 就可以看到下面的效果：
