// 获取最新的消息 function getNewMessage() { // 用户名 var username = document.location.search.split('=')[1];
// 消息显示区域 var div_recentMsg = el("recentMsg");
// 获取最新消息的数据表 var dt = ch111.SendMsg.GetNewMessage().value.Tables[0]; for (var i = 0;i < dt.Rows.length;i++) { // 一条消息对应与一个<span>对象 var oneMsg = document.createElement("span");
// 主进程循环 function mainLoop() { // 获取新消息 getNewMessage();
// 每隔1秒检查一次 setTimeout("mainLoop()", 1000); }
// 显示最近的消息 getRecentMsg();
// 定时更新消息列表 mainLoop(); </script> </form> </body> </HTML> using System; using System.Collections; using System.ComponentModel; using System.Data; using System.Data.SqlClient; using System.Drawing; using System.Web; using System.Web.SessionState; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.HtmlControls; using System.Configuration; using AjaxPro;namespace ch111 { /// <summary> /// SendMsg 的摘要说明。 /// </summary> public class SendMsg : System.Web.UI.Page { protected System.Web.UI.WebControls.Label Label1;
this.offset = 0; var me = this; oPopup.document.body.onmouseover = function(){me.pause=true;} oPopup.document.body.onmouseout = function(){me.pause=false;} var fun = function() { var x = me.left; var y = 0; var width = me.width; var height = me.height;
<script>
window.onerror = new Function("return(false);")
</script><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>类似MSN提示的页面效果</TITLE></HEAD><BODY scroll=no><!--StartFragment-->看到右下角的提示了吗?如果没有看到,<BUTTON onclick=location.reload();>刷新</BUTTON>一下
<SCRIPT language=JavaScript>
window.onload = getMsg;
window.onresize = resizeDiv;
window.onerror = function(){}
//短信提示使用(asilas添加)
var divTop,divLeft,divWidth,divHeight,docHeight,docWidth,objTimer,i = 0;
function getMsg()
{
try{
divTop = parseInt(document.getElementById("eMeng").style.top,10)
divLeft = parseInt(document.getElementById("eMeng").style.left,10)
divHeight = parseInt(document.getElementById("eMeng").offsetHeight,10)
divWidth = parseInt(document.getElementById("eMeng").offsetWidth,10)
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
document.getElementById("eMeng").style.top = parseInt(document.body.scrollTop,10) + docHeight + 10;// divHeight
document.getElementById("eMeng").style.left = parseInt(document.body.scrollLeft,10) + docWidth - divWidth
document.getElementById("eMeng").style.visibility="visible"
objTimer = window.setInterval("moveDiv()",10)
}
catch(e){}
}function resizeDiv()
{
i+=1
if(i>500) closeDiv()
try{
divHeight = parseInt(document.getElementById("eMeng").offsetHeight,10)
divWidth = parseInt(document.getElementById("eMeng").offsetWidth,10)
docWidth = document.body.clientWidth;
docHeight = document.body.clientHeight;
document.getElementById("eMeng").style.top = docHeight - divHeight + parseInt(document.body.scrollTop,10)
document.getElementById("eMeng").style.left = docWidth - divWidth + parseInt(document.body.scrollLeft,10)
}
catch(e){}
}function moveDiv()
{
try
{
if(parseInt(document.getElementById("eMeng").style.top,10) <= (docHeight - divHeight + parseInt(document.body.scrollTop,10)))
{
window.clearInterval(objTimer)
objTimer = window.setInterval("resizeDiv()",1)
}
divTop = parseInt(document.getElementById("eMeng").style.top,10)
document.getElementById("eMeng").style.top = divTop - 1
}
catch(e){}
}
function closeDiv()
{
document.getElementById('eMeng').style.visibility='hidden';
if(objTimer) window.clearInterval(objTimer)
}
</SCRIPT>
<DIV id=eMeng
style="BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 840px; VISIBILITY: hidden; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: 180px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 483px; HEIGHT: 116px; BACKGROUND-COLOR: #c9d3f3">
<TABLE style="BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid"
cellSpacing=0 cellPadding=0 width="100%" bgColor=#cfdef4 border=0>
<TBODY>
<TR>
<TD style="FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #0f2c8c"
width=30 height=24></TD>
<TD
style="PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(msgTopBg.gif); COLOR: #1f336b; PADDING-TOP: 4px"
vAlign=center width="100%">短消息提示: </TD>
<TD
style="PADDING-RIGHT: 2px; BACKGROUND-IMAGE: url(msgTopBg.gif); PADDING-TOP: 2px"
vAlign=center align=right width=19><SPAN title=关闭
style="FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px"
onclick=closeDiv()>× </SPAN><!-- <IMG title=关闭 style="CURSOR: hand" onclick=closeDiv() hspace=3 src="msgClose.jpg"> --></TD></TR>
<TR>
<TD
style="PADDING-RIGHT: 1px; BACKGROUND-IMAGE: url(1msgBottomBg.jpg); PADDING-BOTTOM: 1px"
colSpan=3 height=90>
<DIV
style="BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 13px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 13px; FONT-SIZE: 12px; PADDING-BOTTOM: 13px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 18px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%">您有
<FONT color=#ff0000>1 </FONT>封新短消息 <BR><BR>
<DIV style="WORD-BREAK: break-all" align=center><A
href="javascript:alert('你好')"><FONT color=#ff0000>点击查看短信
</FONT></A></DIV></DIV></TD></TR></TBODY></TABLE></DIV><!--EndFragment--></BODY>
</HTML>
利用一个定时函数定时察看数据库(每n秒/分)
有消息则弹出消息框
无消息则不做事
用ajax实现吧
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>聊天</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<link type="text/css" href="css/global.css">
<script src="javascript/common.js" type="text/javascript"></script>
</HEAD>
<body onunload="dialogArguments.sendWindow=false;" onload="dialogArguments.sendWindow=true;"
bgcolor="#f5f8fc">
<form id="Form1" method="post" runat="server">
<asp:Label id="Label1" runat="server">请输入您要发送的消息</asp:Label>
<TABLE id="Table1" cellSpacing="0" cellPadding="0" width="100%" border="0">
<tr height="1">
<td>
<hr>
</td>
</tr>
<TR>
<TD height="200" valign="top" style="OVERFLOW: scroll;HEIGHT: 300px">
<div id="recentMsg"><FONT face="宋体"></FONT></div>
</TD>
</TR>
<TR height="1">
<TD><hr>
</TD>
</TR>
<TR>
<TD>
<input type="text" id="content" style="WIDTH: 90%" onkeydown="if (event.keyCode==13) {sendMessage();return false;}">
<INPUT type="button" value="发送" onclick="javascript:sendMessage()" style="BORDER-TOP-STYLE: groove; BORDER-RIGHT-STYLE: groove; BORDER-LEFT-STYLE: groove; BACKGROUND-COLOR: #ebf1fa; BORDER-BOTTOM-STYLE: groove">
</TD>
</TR>
<tr>
<td><div id="statusBar"></div>
</td>
</tr>
</TABLE>
<script language="jscript">
// 获取最近的消息
function getRecentMsg()
{
// 消息显示<div>对象
var div_recentMsg = el("recentMsg");
// 根据url获取用户名
var username = document.location.search.split('=')[1];
// 获取最新消息的数据表
var dt = ch111.SendMsg.GetRecentMsg(username).value.Tables[0];
// 从后向前将消息内容显示
for (var i = dt.Rows.length - 1;i >= 0;i--)
{
// 一条消息对应与一个<span>对象
var oneMsg = document.createElement("span");
// 消息发送者与发送对象
var strLine1 = dt.Rows[i].sender + "说: (" + dt.Rows[i].sendtime + ")";
strLine1 = DealBrackets(strLine1);
// 消息内容
var strLine2 = dt.Rows[i].content;
strLine2 = DealBrackets(strLine2);
// 显示样式
oneMsg.innerHTML = "<pre>" + strLine1 + "<br> " + strLine2 + "</pre>";
oneMsg.style.padding = "2px 2px 2px 2px";
oneMsg.style.color = (dt.Rows[i].sender == username) ? "blue" : "red";
oneMsg.style.fontFamily = "'Courier New' , 宋体"; // 附加到DOM
div_recentMsg.appendChild(oneMsg);
}
}
// 发送消息
function sendMessage()
{
// 消息内容输入框
var ta_content = el("content");
// 如果输入内容不为空
if (ta_content.value.length > 0)
{
// 消息显示区域
var div_recentMsg = el("recentMsg");
// 用户名
var username = document.location.search.split('=')[1];
// 发送消息
ch111.SendMsg.SendMessage(username, ta_content.value);
// 清空输入框
ta_content.value = "";
// 页面跟随输入框滚动
ta_content.scrollIntoView(false);
// 获取新消息
getNewMessage();
}
}
// 获取最新的消息
function getNewMessage()
{
// 用户名
var username = document.location.search.split('=')[1];
// 消息显示区域
var div_recentMsg = el("recentMsg");
// 获取最新消息的数据表
var dt = ch111.SendMsg.GetNewMessage().value.Tables[0];
for (var i = 0;i < dt.Rows.length;i++)
{
// 一条消息对应与一个<span>对象
var oneMsg = document.createElement("span");
// 消息发送者与发送对象
var strLine1 = dt.Rows[i].sender + "说: (" + dt.Rows[i].sendtime + ")";
strLine1 = DealBrackets(strLine1);
// 消息内容
var strLine2 = dt.Rows[i].content;
strLine2 = DealBrackets(strLine2);
// 显示样式
oneMsg.innerHTML = "<pre>" + strLine1 + "<br> " + strLine2 + "</pre>";
oneMsg.style.padding = "2px 2px 2px 2px";
oneMsg.style.color = (dt.Rows[i].sender == username) ? "blue" : "red";
oneMsg.style.fontFamily = "'Courier New' , 宋体"; // 附加到DOM
div_recentMsg.appendChild(oneMsg);
}
}
// 主进程循环
function mainLoop()
{
// 获取新消息
getNewMessage();
// 每隔1秒检查一次
setTimeout("mainLoop()", 1000);
}
// 显示最近的消息
getRecentMsg();
// 定时更新消息列表
mainLoop();
</script>
</form>
</body>
</HTML>
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Data.SqlClient;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Configuration;
using AjaxPro;namespace ch111
{
/// <summary>
/// SendMsg 的摘要说明。
/// </summary>
public class SendMsg : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Label Label1;
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
Utility.RegisterTypeForAjax(typeof(SendMsg));
} #region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load); }
#endregion /// <summary>
/// 获取最近的消息
/// </summary>
/// <param name="strUsername">用户名</param>
/// <returns>最近消息的数据集</returns>
[AjaxMethod()]
public DataSet GetRecentMsg(string strUsername)
{
// 返回的数据集
DataSet ds = new DataSet(); // 数据连接
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnStr"]); // SQL命令
SqlCommand cmd = conn.CreateCommand();
cmd.CommandText = string.Format(
"GetRecentMsg '{0}','{1}', {2}",
User.Identity.Name, strUsername, 8); // 数据适配器
SqlDataAdapter da = new SqlDataAdapter(cmd); try
{
// 填充消息信息
da.Fill(ds);
}
catch (SqlException)
{
}
finally
{
// 关闭连接
conn.Close();
} return ds;
} /// <summary>
/// 发送消息
/// </summary>
/// <param name="strUsername">用户名</param>
/// <param name="strContent">内容</param>
[AjaxMethod()]
public void SendMessage(string strUsername, string strContent)
{
// 数据连接
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnStr"]); // SQL命令
SqlCommand cmd = conn.CreateCommand();
cmd.CommandText = string.Format("SendMessage '{0}','{1}', '{2}'",
User.Identity.Name, strUsername, strContent); try
{
// 打开数据连接
conn.Open(); // 执行SQL,发送消息
cmd.ExecuteNonQuery();
}
catch (SqlException)
{
}
finally
{
// 关闭连接
conn.Close();
}
} /// <summary>
/// 获取新消息
/// </summary>
/// <returns>新消息数据集</returns>
[AjaxMethod()]
public DataSet GetNewMessage()
{
// 返回的数据集
DataSet ds = new DataSet(); // 数据连接
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnStr"]); // SQL命令
SqlCommand cmd = conn.CreateCommand();
cmd.CommandText = string.Format("GetNewMessage '{0}'", User.Identity.Name); // 数据适配器
SqlDataAdapter da = new SqlDataAdapter(cmd); try
{
// 向DataSet中填充消息数据
da.Fill(ds);
}
catch (SqlException)
{
}
finally
{
// 关闭连接
conn.Close();
} return ds;
}
}
}以上仅为发送信息的页面及代码,源码和数据库可到这里下载
** ==================================================================================================
** 类名:CLASS_MSN_MESSAGE
** 功能:提供类似MSN消息框
** 示例:
---------------------------------------------------------------------------------------------------
var MSG = new CLASS_MSN_MESSAGE("aa",200,120,"短消息提示:","您有1封消息","今天请我吃饭哈");
MSG.show();
---------------------------------------------------------------------------------------------------
** 作者:ttyp
** 邮件:[email protected]
** 日期:2005-3-18
** ==================================================================================================
**/
/*
* 消息构造
*/
function CLASS_MSN_MESSAGE(id,width,height,caption,title,message,target,action)
{
this.id = id;
this.title = title;
this.caption= caption;
this.message= message;
this.target = target;
this.action = action;
this.width = width?width:200;
this.height = height?height:120;
this.timeout= 150;
this.speed = 20;
this.step = 1;
this.right = screen.width -1;
this.bottom = screen.height;
this.left = this.right - this.width;
this.top = this.bottom - this.height;
this.timer = 0;
this.pause = false;
}
/*
* 隐藏消息方法
*/
CLASS_MSN_MESSAGE.prototype.hide = function()
{
if(this.onunload())
{
var offset = this.height>this.bottom-this.top?this.height:this.bottom-this.top;
var me = this;
if(this.timer>0)
{
window.clearInterval(me.timer);
}
var fun = function()
{
if(me.pause==false)
{
var x = me.left;
var y = 0;
var width = me.width;
var height = 0;
if(me.offset>0)
{
height = me.offset;
}
y = me.bottom - height;
if(y>=me.bottom)
{
window.clearInterval(me.timer);
me.Pop.hide();
}
else
{
me.offset = me.offset - me.step;
}
me.Pop.show(x,y,width,height);
}
}
this.timer = window.setInterval(fun,this.speed)
}
}
/*
* 消息卸载事件,可以重写
*/
CLASS_MSN_MESSAGE.prototype.onunload = function()
{
return true;
}
/*
* 消息命令事件,要实现自己的连接,请重写它
*
*/
CLASS_MSN_MESSAGE.prototype.oncommand = function()
{
//alert("OK");
this.hide();
}
/*
* 消息显示方法
*/
CLASS_MSN_MESSAGE.prototype.show = function()
{
var oPopup = window.createPopup(); //IE5.5+
this.Pop = oPopup;
var w = this.width;
var h = this.height;
var str = "<DIV style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 0px; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: " + w + "px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: " + h + "px; BACKGROUND-COLOR: #c9d3f3'>"
str += "<TABLE style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid' cellSpacing=0 cellPadding=0 width='100%' bgColor=#CEDBF3 border=0>"
str += "<TR>"
str += "<TD style='FONT-SIZE: 12px;COLOR: #0f2c8c' width=30 height=24></TD>"
str += "<TD style='PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #1f336b; PADDING-TOP: 4px' vAlign=center width='100%'>" + this.caption + "</TD>"
str += "<TD style='PADDING-RIGHT: 2px; PADDING-TOP: 2px' vAlign=center align=right width=19>"
str += "<SPAN title=关闭 style='FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px' id='btSysClose' >×</SPAN></TD>"
str += "</TR>"
str += "<TR>"
str += "<TD style='PADDING-RIGHT: 1px;PADDING-BOTTOM: 1px' colSpan=3 height=" + (h-28) + ">"
str += "<DIV style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 8px; FONT-SIZE: 12px; PADDING-BOTTOM: 8px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 8px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%'>" + this.title + "<BR><BR>"
str += "<DIV style='WORD-BREAK: break-all' align=left><A href='javascript:void(0)' hidefocus=true id='btCommand'><FONT color=#ff0000>" + this.message + "</FONT></A></DIV>"
str += "</DIV>"
str += "</TD>"
str += "</TR>"
str += "</TABLE>"
str += "</DIV>"
oPopup.document.body.innerHTML = str;
this.offset = 0;
var me = this; oPopup.document.body.onmouseover = function(){me.pause=true;}
oPopup.document.body.onmouseout = function(){me.pause=false;} var fun = function()
{
var x = me.left;
var y = 0;
var width = me.width;
var height = me.height;
if(me.offset>me.height)
{
height = me.height;
}
else
{
height = me.offset;
}
y = me.bottom - me.offset;
if(y<=me.top)
{
me.timeout--;
if(me.timeout==0)
{
window.clearInterval(me.timer);
me.hide();
}
}
else
{
me.offset = me.offset + me.step;
}
me.Pop.show(x,y,width,height);
}
this.timer = window.setInterval(fun,this.speed)
var btClose = oPopup.document.getElementById("btSysClose");
btClose.onclick = function()
{
me.hide();
}
var btCommand = oPopup.document.getElementById("btCommand");
btCommand.onclick = function()
{
me.oncommand();
}
}
/*
** 设置速度方法
**/
CLASS_MSN_MESSAGE.prototype.speed = function(s)
{
var t = 20;
try
{
t = praseInt(s);
}
catch(e){}
this.speed = t;
}
/*
** 设置步长方法
**/
CLASS_MSN_MESSAGE.prototype.step = function(s)
{
var t = 1;
try
{
t = praseInt(s);
}
catch(e){}
this.step = t;
}
CLASS_MSN_MESSAGE.prototype.rect = function(left,right,top,bottom)
{
try
{
this.left = left !=null?left:this.right-this.width;
this.right = right !=null?right:this.left +this.width;
this.bottom = bottom!=null?(bottom>screen.height?screen.height:bottom):screen.height;
this.top = top !=null?top:this.bottom - this.height;
}
catch(e)
{}
} JavaScript实现的消息弹出框,下载地址,完整资源包!
好像有这种控件的!!
搜搜!!