您的位置：首页 > Web前端 > JavaScript

ExtJs 实现类似QQ的提示消息框

2014-02-20 16:03 344 查看

ExtJs实现类似QQ的提示消息框

1 扩展Ext.Window控件

Ext.namespace("Ext.ux");
Ext.ux.SysMsgWindowManager = {
positions: []
};

Ext.ux.SysMsgWindow = Ext.extend(Ext.Window, {
setTitle: function(title, iconCls){
Ext.ux.SysMsgWindow.superclass.setTitle.call(this, title, iconCls||this.iconCls);
},
setMessage: function(msg){
this.body.update(msg);
},
initComponent: function(){
Ext.apply(this, {
iconCls: this.iconCls ||
'information',
width: 250,
height: 150,
autoScroll: true,
autoDestroy: true,
plain: false,
shadow:false
});
this.task =
new Ext.util.DelayedTask(this.hide,
this);
Ext.ux.SysMsgWindow.superclass.initComponent.call(this);
},
onRender:function(ct, position) {
Ext.ux.SysMsgWindow.superclass.onRender.call(this, ct, position);
},
onDestroy: function(){
Ext.ux.SysMsgWindowManager.positions.remove(this.pos);
Ext.ux.SysMsgWindow.superclass.onDestroy.call(this);
},
afterShow: function(){
Ext.ux.SysMsgWindow.superclass.afterShow.call(this);
this.on('move',
function(){
Ext.ux.SysMsgWindowManager.positions.remove(this.pos);
this.task.cancel();
}, this);
this.task.delay(4000);
},
animShow: function(){
this.pos = 0;
while(Ext.ux.SysMsgWindowManager.positions.indexOf(this.pos)>-1)
this.pos++;
Ext.ux.SysMsgWindowManager.positions.push(this.pos);
this.setSize(250,150);
this.el.alignTo(document,
"br-br", [ -10, -10-((this.getSize().height+10)*this.pos) ]);
this.el.slideIn('b', {
duration: 2,
callback: this.afterShow,
scope: this
});
},
animHide: function(){
Ext.ux.SysMsgWindowManager.positions.remove(this.pos);
this.el.ghost("b", {
duration: 2,
remove: true,
scope: this,
callback: this.destroy
});
}
});

2 调用方法

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航