說是extaspnet實現(xiàn)右下角彈消息框,其實就是純extjs,baidu搜索一大堆代碼
咱只是搬過來直接用,談不上原創(chuàng)
廢話少說,上代碼,在頁面前端加入這段JS代碼
<script type="text/javascript">
Ext.ns('MyLib');
;(function($) {
//新建window組,避免被其它window影響顯示在最前的效果
var tipsGroupMgr = new Ext.WindowGroup();
tipsGroupMgr.zseed=99999; //將小貼士窗口前置
$.TipsWindow = Ext.extend(Ext.Window, {
width:200,
height:150,
layout:'fit',
modal : false,
plain: true,
shadow:false, //去除陰影
draggable:false, //默認(rèn)不可拖拽
resizable:false,
closable: true,
closeAction:'hide', //默認(rèn)關(guān)閉為隱藏
autoHide:3, //n秒后自動隱藏,為false時,不自動隱藏
manager: tipsGroupMgr, //設(shè)置window所屬的組
constructor: function(conf){
$.TipsWindow.superclass.constructor.call(this, conf);
this.initPosition(true);
},
initEvents: function() {
$.TipsWindow.superclass.initEvents.call(this);
//自動隱藏
if(false !== this.autoHide){
var task = new Ext.util.DelayedTask(this.hide, this), second = (parseInt(this.autoHide) || 3) * 1000;
this.on('beforeshow', function(self) {
task.delay(second);
});
}
this.on('beforeshow', this.showTips);
this.on('beforehide', this.hideTips);
Ext.EventManager.onWindowResize(this.initPosition, this); //window大小改變時,重新設(shè)置坐標(biāo)
Ext.EventManager.on(window, 'scroll', this.initPosition, this); //window移動滾動條時,重新設(shè)置坐標(biāo)
},
//參數(shù): flag - true時強(qiáng)制更新位置
initPosition: function(flag) {
if(true !== flag && this.hidden){ //不可見時,不調(diào)整坐標(biāo)
return false;
}
var doc = document, bd = (doc.body || doc.documentElement);
//ext取可視范圍寬高(與上面方法取的值相同), 加上滾動坐標(biāo)
var left = bd.scrollLeft + Ext.lib.Dom.getViewWidth()-4-this.width;
var top = bd.scrollTop + Ext.lib.Dom.getViewHeight()-4-this.height;
this.setPosition(left, top);
},
showTips: function() {
var self = this;
if(!self.hidden){return false;}
self.initPosition(true); //初始化坐標(biāo)
self.el.slideIn('b', {
callback: function() {
//顯示完成后,手動觸發(fā)show事件,并將hidden屬性設(shè)置false,否則將不能觸發(fā)hide事件
self.fireEvent('show', self);
self.hidden = false;
}
});
return false; //不執(zhí)行默認(rèn)的show
},
hideTips: function() {
var self = this;
if(self.hidden){return false;}
self.el.slideOut('b', {
callback: function() {
//漸隱動作執(zhí)行完成時,手動觸發(fā)hide事件,并將hidden屬性設(shè)置true
self.fireEvent('hide', self);
self.hidden = true;
}
});
return false; //不執(zhí)行默認(rèn)的hide
}
});
})(MyLib);
function showmsg(title,content)
{
var tipw = new MyLib.TipsWindow({
title:title,
autoHide:5, //5秒自動關(guān)閉
html:content
});
tipw.show();
}
</script>
調(diào)用代碼,后臺C#
- protected void Button1_Click(object sender, EventArgs e)
- { ExtAspNet.PageContext.RegisterStartupScript("showmsg('提示','黃藝博和<b>林妙可</b>的故事!<br />...');");
- }
效果圖:
這個是彈在最上方的window,不受框架影響,5秒后消失,好了,收工
|