用javascript作消息提示框(类似于QQ用户上线的消息提示)

javascript

在开发项目的时候,需要在有用户消息的时候提醒用户,刚好自己的QQ好友上线,QQ自动弹出一个消息提示,觉得不错。所以用javascript利用popup作了一个类似的功能。

<html>
 <head>
  <title>HTMLPage1</title>
  <meta name="vs_defaultClientScript" content="JavaScript">
  <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
  <meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
  <meta name="ProgId" content="VisualStudio.HTML">
  <meta name="Originator" content="Microsoft Visual Studio .NET 7.1">
 </head>
 
 <script language =javascript>
   var titlePopup
   var len;
   
   function InitMsgBox()
   { len = 0;
    titlePopup=window.createPopup();
    var titlePopupBody = titlePopup.document.body;
    titlePopupBody.style.border ="solid black 1px";
    var titleContent = "";
    titleContent = titleContent + "<table cellPadding='5' bgcolor='#65c1ff' width='100%' height='100%' border=0 cellspacing=0 cellpadding=0>";
    titleContent = titleContent + "<tr><td align=center><font size = 2>消息提醒</font></td></tr>";
    titleContent = titleContent + "<tr><td><font size = 2>内容</td></font></tr>";
    titleContent = titleContent + "<tr><td><font size = 2>内容</td></font></tr>";
    titleContent = titleContent + "<tr><td><font size = 2>日期</td></font></tr>";
    titleContent = titleContent + "</table>";    
    titlePopupBody.innerHTML = titleContent;
         
    ShowMsgBox();
   }
      
   function MsgBox()
   { 
    len += 4;      
    if (len > 110)
    {   
     window.clearInterval(tID);     
    }        
    else
    {//170固定了消息提示框的宽度
     titlePopup.show(document.body.clientWidth - 170, document.body.clientHeight - len, 170, len, top.document.body); 
    }    
   }
   
   var tID
   function ShowMsgBox()
   {
    tID = window.setInterval("MsgBox()",15);    
   }
 </script>
 
 <body MS_POSITIONING="GridLayout">
  <INPUT id="Button1" style="Z-INDEX: 101; LEFT: 296px; POSITION: absolute; TOP: 344px" type="button"
   value="Button" name="Button1">
 </body>
</html>

<html> <head> <title>HTMLPage1</title> <meta name="vs_defaultClientScript" content="JavaScript"> <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"> <meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1"> <meta name="ProgId" content="VisualStudio.HTML"> <meta name="Originator" content="Microsoft Visual Studio .NET 7.1"> </head> <script language =javascript> var titlePopup var len; function InitMsgBox() { len = 0; titlePopup=window.createPopup(); var titlePopupBody = titlePopup.document.body; titlePopupBody.style.border ="solid black 1px"; var titleContent = ""; titleContent = titleContent + "<table cellPadding='5' bgcolor='#65c1ff' width='100%' height='100%' border=0 cellspacing=0 cellpadding=0>"; titleContent = titleContent + "<tr><td align=center><font size = 2>消息提醒</font></td></tr>"; titleContent = titleContent + "<tr><td><font size = 2>内容</td></font></tr>"; titleContent = titleContent + "<tr><td><font size = 2>内容</td></font></tr>"; titleContent = titleContent + "<tr><td><font size = 2>日期</td></font></tr>"; titleContent = titleContent + "</table>"; titlePopupBody.innerHTML = titleContent; ShowMsgBox(); } function MsgBox() { len += 4; if (len > 110) { window.clearInterval(tID); } else {//170固定了消息提示框的宽度 titlePopup.show(document.body.clientWidth - 170, document.body.clientHeight - len, 170, len, top.document.body); } } var tID function ShowMsgBox() { tID = window.setInterval("MsgBox()",15); } </script> <body MS_POSITIONING="GridLayout"> <INPUT id="Button1" style="Z-INDEX: 101; LEFT: 296px; POSITION: absolute; TOP: 344px" type="button" value="Button" name="Button1"> </body></html>

    [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

时间: 2024-12-17 06:26:16

用javascript作消息提示框(类似于QQ用户上线的消息提示)的相关文章

showModalDialog网页对话框关闭时刷新父窗口时,弹出这样的提示框&amp;amp;quot;请重新发送消息,无法刷新网页&amp;amp;quot;

问题描述 showModalDialog网页对话框关闭时刷新父窗口时,弹出这样的提示框"请重新发送消息,无法刷新网页"在网上找了N种办法,就是没用,真伤脑筋.请教哪位大侠指教,项目好赶,如果问题解决马上给分. 解决方案 解决方案二:你是怎么刷的父页?是在父页用location.reload()刷吗?如果是这样的话,注意看一下子窗口的<head><Basetarget="_self"/>解决方案三:我里面已经写了<Basetarget=&

【Android开发】消息提示框与对话框-使用Toast显示消息提示框

在前面的实例中,已经应用过Toast类来显示一个简单的提示框了.这次将对Toast进行详细介绍.Toast类用于在屏幕中显示一个消息提示框,该消息提示框没有任何控制按钮,并且不会获得焦点,经过一段时间后自动消失.通常用于显示一些快速提示信息,应用范围非常广泛. 使用Toast来显示消息提示框非常简单,只需要一下三个步骤: (1).创建一个Toast对象.通常有两种方法:一种是使用构造方式进行创建: Toast toast=new Toast(this); 另一种是调用Toast类的makeTex

asp.net textbox javascript实现enter与ctrl+enter互换 文本框发送消息与换行(类似于QQ)_实用技巧

1.也许讲解有点初级,希望高手不要"喷"我,因为我知道并不是每一个人都是高手,我也怕高手们说我装13: 2.如有什么不对的地方,还希望大家指出,一定虚心学习,如果有更好的办法请告诉我一声哦: 3.本文属于作者原创,尊重他人劳动成果,转载请注明作者,谢谢. 下面开讲: 如题,这个功能也困扰了我一两天事件了,我也上网找了很多资料,但是网上大部分的说法都差不多,问题始终还是没解决,于是乎我开始找是问题的根源,我开始用的是文本框的onkeydown事件,分别写了两个js函数,如下: 复制代码

qt qtreewidget-qt实现一个类似于QQ的好友列表 用Qtreewidget 怎么实现消息小红点提示

问题描述 qt实现一个类似于QQ的好友列表 用Qtreewidget 怎么实现消息小红点提示 如题 我想用一个label显示消息的数量 就是类似于QQ那种未读消息红点显示的那种 item所在的treewidget->setItemwidget()添加一个列为label 可是运行起来却不显示这个label 求教 解决方案 http://blog.csdn.net/shuideyidi/article/details/30619167

新手学JavaScript(三)----超酷消息警告框插件(SweetAlert)

HTML JavaScript API     今天给大家推荐一款不错的超酷消息警告框–SweetAlert:SweetAlert是一款不需要jQuery支持的原生js提示框,风格类似bootstrap.它的提示框不仅美丽动人,并且允许自定义,支持设置提示框标题.提示类型.内容展示图片.确认取消按钮文本.点击后回调函数等.和传统的alert相比: SweetAlert 能在页面自动居中,支持桌面环境,移动端和平板,并且高度自定义.接下来看看它的具体使用! HTML     首先引入相应的js和c

微信小程序-消息提示框实例_javascript技巧

做Android的时候对toast是很熟悉的.微信小程序开发中toast也是重要的消息提示方式. 提示框: wx.showToast(OBJECT) 显示消息提示框 OBJECT参数说明: 示例代码: wx.showToast({ title: '成功', icon: 'success', duration: 2000 }) wx.hideToast() 隐藏消息提示框 wx.showToast({ title: '加载中', icon: 'loading', duration: 10000 }

JavaScript SweetAlert插件实现超酷消息警告框_javascript技巧

今天给大家推荐一款不错的超酷消息警告框–SweetAlert:SweetAlert是一款不需要jQuery支持的原生js提示框,风格类似bootstrap.它的提示框不仅美丽动人,并且允许自定义,支持设置提示框标题.提示类型.内容展示图片.确认取消按钮文本.点击后回调函数等.和传统的alert相比: SweetAlert 能在页面自动居中,支持桌面环境,移动端和平板,并且高度自定义.接下来看看它的具体使用! HTML 首先引入相应的js和css,该插件不需要jQuery插件的支持: <link

javascript 实用的文字链提示框效果_文字特效

效果要基本实现以下功能: (1)鼠标滑过文章中的链接文字,要在相应位置弹出提示框,提示框的样式由css来控制,高度自适应:鼠标可以点击提示框的中的链接,滑离提示框时,框自动消失: (2)把提示框的位置控制在文本域范围之内,如果链接文字处在文本域左侧,提示框要居右显示,使其不会出离文本域:反之,如果链接文字处在文本域右侧,提示框要居左显示: (3)如果文本域内容很多,而链接文字恰巧处于浏览器底部,为了使提示框不出离于浏览器的可视范围,提示框的位置要自动调整到链接文字的上面: 1.css 复制代码

用什么技术可以实现跟qq似的右下角弹出提示框的功能?怎么实现呢?我用ssh框架。

问题描述 我在项目中要实现一个定时提醒的功能,就是每隔一段指定时间在屏幕右下角弹出提示框,提醒用户的待办任务,我用ssh框架,应该怎么实现呢? 解决方案 引用一个定时提醒的功能,就是每隔一段指定时间在屏幕右下角弹出提示框我们项目有类似功能 用的 js timeout 实现的!大概思路是 timeout 定时刷 服务器某个 action 判断时间或者条件 返回不同的值!或者你们也可以尝试先 长连接什么的 不过我感觉没必要吧!解决方案二:框架只是一种便利的规范我觉得用什么做都行啊...