xiyuliuguang
- 浏览: 32278 次
- 性别:
- 来自: 沈阳
-
最新评论
<%@ page language="java" contentType="text/html;charset=gbk"
pageEncoding="gbk"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort();
String path = basePath + request.getContextPath() + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>右下角的弹窗，消息框</title>
</head>
<style type="text/css">
#winpop { width:200px; height:0px; position:absolute; right:5px; bottom:5px; border:1px solid #999999; margin:0; padding:1px; overflow:hidden; display:none; background:#FFFFFF}
#winpop .title { width:100%; height:20px; line-height:20px; background:#FFCC00; font-weight:bold; text-align:center; font-size:12px;}
#winpop .con { width:100%; height:80px; line-height:80px; font-weight:bold; font-size:12px; color:#FF0000; text-decoration:underline; text-align:center}
#silu { font-size:13px; color:#999999; position:absolute; right:0; text-align:right; text-decoration:underline; line-height:22px;}
.close { position:absolute; right:4px; top:-1px; color:#FFFFFF; cursor:pointer}
</style>
<script type="text/javascript">
function tips_pop(){
var MsgPop=document.getElementById("winpop");//获取窗口这个对象,即ID为winpop的对象
var popH=parseInt(MsgPop.style.height);//用parseInt将对象的高度转化为数字,以方便下面比较
if (popH==0){ //如果窗口的高度是0
MsgPop.style.display="block";//那么将隐藏的窗口显示出来
show=setInterval("changeH('up')",2);//开始以每0.002秒调用函数changeH("up"),即每0.002秒向上移动一次
}
else { //否则
hide=setInterval("changeH('down')",2);//开始以每0.002秒调用函数changeH("down"),即每0.002秒向下移动一次
}
}
function changeH(str) {
var MsgPop=document.getElementById("winpop");
var popH=parseInt(MsgPop.style.height);
if(str=="up"){ //如果这个参数是UP
if (popH<=100){ //如果转化为数值的高度小于等于100
MsgPop.style.height=(popH+4).toString()+"px";//高度增加4个象素
}
else{
clearInterval(show);//否则就取消这个函数调用,意思就是如果高度超过100象度了,就不再增长了
}
}
if(str=="down"){
if (popH>=4){ //如果这个参数是down
MsgPop.style.height=(popH-4).toString()+"px";//那么窗口的高度减少4个象素
}
else{ //否则
clearInterval(hide); //否则就取消这个函数调用,意思就是如果高度小于4个象度的时候,就不再减了
MsgPop.style.display="none"; //因为窗口有边框,所以还是可以看见1~2象素没缩进去,这时候就把DIV隐藏掉
}
}
}
window.onload=function(){ //加载
document.getElementById('winpop').style.height='0px';//我不知道为什么要初始化这个高度,CSS里不是已经初始化了吗,知道的告诉我一下
setTimeout("tips_pop()",800); //3秒后调用tips_pop()这个函数
}
</script>
<body>
<div id="silu">
</div>
<div id="winpop">
<div class="title">您有新的消息<span class="close" onclick="tips_pop()">X</span></div>
<div class="con">未读信息(1)</div>
</div>
</body>
</html>
pageEncoding="gbk"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort();
String path = basePath + request.getContextPath() + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>右下角的弹窗，消息框</title>
</head>
<style type="text/css">
#winpop { width:200px; height:0px; position:absolute; right:5px; bottom:5px; border:1px solid #999999; margin:0; padding:1px; overflow:hidden; display:none; background:#FFFFFF}
#winpop .title { width:100%; height:20px; line-height:20px; background:#FFCC00; font-weight:bold; text-align:center; font-size:12px;}
#winpop .con { width:100%; height:80px; line-height:80px; font-weight:bold; font-size:12px; color:#FF0000; text-decoration:underline; text-align:center}
#silu { font-size:13px; color:#999999; position:absolute; right:0; text-align:right; text-decoration:underline; line-height:22px;}
.close { position:absolute; right:4px; top:-1px; color:#FFFFFF; cursor:pointer}
</style>
<script type="text/javascript">
function tips_pop(){
var MsgPop=document.getElementById("winpop");//获取窗口这个对象,即ID为winpop的对象
var popH=parseInt(MsgPop.style.height);//用parseInt将对象的高度转化为数字,以方便下面比较
if (popH==0){ //如果窗口的高度是0
MsgPop.style.display="block";//那么将隐藏的窗口显示出来
show=setInterval("changeH('up')",2);//开始以每0.002秒调用函数changeH("up"),即每0.002秒向上移动一次
}
else { //否则
hide=setInterval("changeH('down')",2);//开始以每0.002秒调用函数changeH("down"),即每0.002秒向下移动一次
}
}
function changeH(str) {
var MsgPop=document.getElementById("winpop");
var popH=parseInt(MsgPop.style.height);
if(str=="up"){ //如果这个参数是UP
if (popH<=100){ //如果转化为数值的高度小于等于100
MsgPop.style.height=(popH+4).toString()+"px";//高度增加4个象素
}
else{
clearInterval(show);//否则就取消这个函数调用,意思就是如果高度超过100象度了,就不再增长了
}
}
if(str=="down"){
if (popH>=4){ //如果这个参数是down
MsgPop.style.height=(popH-4).toString()+"px";//那么窗口的高度减少4个象素
}
else{ //否则
clearInterval(hide); //否则就取消这个函数调用,意思就是如果高度小于4个象度的时候,就不再减了
MsgPop.style.display="none"; //因为窗口有边框,所以还是可以看见1~2象素没缩进去,这时候就把DIV隐藏掉
}
}
}
window.onload=function(){ //加载
document.getElementById('winpop').style.height='0px';//我不知道为什么要初始化这个高度,CSS里不是已经初始化了吗,知道的告诉我一下
setTimeout("tips_pop()",800); //3秒后调用tips_pop()这个函数
}
</script>
<body>
<div id="silu">
</div>
<div id="winpop">
<div class="title">您有新的消息<span class="close" onclick="tips_pop()">X</span></div>
<div class="con">未读信息(1)</div>
</div>
</body>
</html>
分享到：
发表评论
-
百度地图和ztree开发电子围栏功能
2016-09-29 09:27 4797jsp <%@ page language=" ... -
Oracle11g Enterprise Manager配置失败
2014-04-29 11:20 2563Win7先安装oracle 11g时,安装检测到系统的主 IP ... -
java弹窗导入导出文件
2014-03-24 11:42 1517package com.action.frame; impo ... -
jsp访问上级窗口元素
2014-04-29 11:22 437opener.document.getElementById( ... -
页面关闭IE触发事件方法
2013-09-30 09:56 578function window.onbeforeunload( ... -
oracle 日期列表
2013-09-29 12:52 518获取某个时间段之间的月份列表(示例返回2009-03到2010 ... -
倒计时
2013-09-24 10:01 343//提交 function doSubmit(){ ... -
oracle11G 最新驱动包
2013-09-24 10:00 696oracle11G 最新驱动包 解决与Spring冲突问题 ... -
获取第几天后的日期
2013-09-16 09:23 585Calendar cal = Calendar.getInst ... -
web工程下获取properties文件
2013-09-16 09:19 559String propertiesPath = getClas ... -
javamail
2013-09-16 09:15 556final SendMail sendmail = new S ... -
java根据年和周获取当前的日期时间段
2013-09-16 09:10 1290String[] dates = new String[7]; ... -
JSP判断日期间隔天数
2013-07-15 11:14 626var temp_field1 = $("#temp ... -
dtree不选中子节点处理
2013-05-17 10:35 1296//dtree.js 208行（chks[i].checked ... -
IE8下JS插入表格
2013-05-17 10:25 660//IE8下使用JS插入JSP表格 var tbl = do ... -
JSP选项卡显示
2013-05-17 10:22 2016<%@ page language="java ... -
JSP样式实例
2013-05-10 15:59 669<%@ page contentType="t ... -
Oracle表空间和用户创建赋权限
2013-05-10 15:54 662--RLDM CREATE TABLESPACE RLDM D ... -
hibernate oracle 主键递增
2013-05-10 15:47 481<?xml version="1.0" ... -
Spring配置文件，SSH， Oracl数据库
2013-05-10 15:45 728<?xml version="1.0" ...
相关推荐
**jQuery 实现页面右下角消息提示框** 在网页设计中，实时反馈用户操作状态或者显示重要信息是非常关键的一环。jQuery，一个流行的JavaScript库，提供了丰富的功能来简化这一过程。本教程将深入探讨如何利用jQuery...
Bootstrap提供了便捷的`alert`组件，可以轻松地在页面右下角展示消息。 2. **HTML结构** 首先，需要在页面的底部添加一个隐藏的div，作为消息提示的容器。使用CSS设置其初始位置为屏幕右下角，并通过JavaScript...
在ASP.NET开发中，创建一个类似QQ或MSN的页面右下角弹出消息提示框功能是一项常见的需求。这种提示框可以用于通知用户、显示警告信息或者进行交互式操作反馈。以下是一个详细的实现步骤和相关知识点： 1. **CSS布局...
在本教程中，我们将探讨如何利用jQuery实现右下角的消息提示框功能，这在Web应用程序中非常常见，用于向用户显示通知、警告或确认信息。 首先，我们需要理解jQuery的核心概念。jQuery通过选择器来选取HTML元素，...
jQuery右下角消息提示框是一种常见的用户交互设计，它能够为用户提供实时反馈，增强用户体验。在Web开发中，jQuery库以其简洁的API和强大的功能深受开发者喜爱，而创建这种消息提示框是jQuery应用的一个实例。 首先...
该技术可用于实现类似于CSDN网站右下角的消息提示功能。 ### 知识点解析 #### 1. 理解 `CLASS_MSN_MESSAGE` 类 `CLASS_MSN_MESSAGE` 是一个自定义类，用于创建并管理一个弹出的消息提示框。它接受多个参数以定义...
C# WinForm 消息提示功能，类似QQ的消息提醒样式，可定时关闭，消息框弹出从下往上，关闭从上往下，有动画效果。当用户鼠标停放在提示框上时，自动关闭功能停止 ，当移走鼠标时，重新开始自动关闭功能 。有C#源码；...
标题提到的“页面右下角弹出类似QQ、MSN多条消息提示(提示可连接)”就是这样的一个设计，它允许网站向用户推送通知或消息，并且这些消息可以链接到本地页面或外部网址，从而引导用户进行特定的操作。 这个功能的...
在网页设计中，创建一个类似QQ或CSDN右下角的提示框是常见的功能，主要用于显示消息通知、广告信息或是交互反馈。这种提示框通常称为"气泡通知"或"浮层提示"，它不干扰用户的主要操作，又能有效地传递信息。下面将...
"模仿QQ消息提示右下角弹出窗口提示代码源文件4种不同方式"是一个专注于实现这一功能的资源，它提供了多种实现此类通知的技术手段。下面将详细阐述这四种不同的实现方式以及它们在实际应用中的价值。 首先，右下角...
页面右下角弹出类似MSN的消息提示 网上有代码，里面可以自己修改一下参数，变成自己实用的Js
"js实现右下角消息通知.zip"这个压缩包提供了一种使用JavaScript实现在页面右下角显示消息通知的方法。以下是对这一技术的详细说明： 首先，让我们了解一下什么是消息通知。在用户界面上，消息通知是一种非侵入性的...
现在作web开发，常常遇到需要消息提醒功能，我在网上找了一个js右下角弹出提示消息的例子，用还是挺不错的，大家可以试试。
标题中的“【精华】页面右下角弹出类似QQ或MSN的消息提示”指的是在网页设计中实现一种类似于即时通讯软件（如QQ、MSN）的消息提示功能。这种功能常见于许多网站，尤其是企业级应用，用于通知用户新消息、提醒或者...
在网页设计中，为了增强用户体验和互动性，开发者经常会在页面右下角设计类似QQ或MSN的消息提示功能。这种功能可以模拟即时通讯软件中的消息通知，让用户在浏览网页时能够实时接收并查看重要信息。本教程将深入探讨...
在网页设计和用户体验优化中，实现“页面右下角弹出类似QQ、MSN多条消息提示(提示消息有URL链接)”的功能是一项常见的需求。这样的功能可以让用户在浏览网站时，实时接收并交互与网站内容相关的通知，提升用户的参与...
在JavaScript编程中，实现点击按钮后在屏幕右下角弹出消息通知提示框是一项常见的功能，主要用于向用户显示系统状态或操作反馈。本教程将详细讲解如何创建这种通知提示框，包括默认、成功、警告和危险四种不同类型的...
总结来说，"jquery右下角提示框"是利用jQuery实现的一种用户界面元素，它提供了一种在页面右下角展示信息的方式，而通用版本则意味着这个功能可以在多页面项目中轻松复用。通过创建基类页面，开发者可以有效地提高...
网页右下角弹出提示框是一种常见的用户交互设计，它能够有效地吸引用户的注意力，传递重要信息或引导用户进行特定操作。这种设计在许多网站和应用中都有应用，尤其是在电子商务、新闻资讯以及社交媒体平台中尤为常见...
在标题和描述中提到的“asp.net 网页右下角弹出消息提示对话框（最小化提示框时带有小图标闪烁效果）”，这是一种常见的交互设计，用于吸引用户的注意力，即使他们在浏览其他窗口或应用时也能注意到这些重要的消息。...