`
younglibin
  • 浏览: 1207654 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

在网页右下角弹出提示窗口(完整实例)+参数说明

    博客分类:
  • JSP
阅读更多
<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{

//  parseInt(String s, int radix) 
 //		使用第二个参数指定的基数,将字符串参数解析为有符号的整数。 Integer中的方法
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>99999) 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>

 

 

 

 

完整jsp页面代码:

 

<%@ page language="java" import="java.util.*" pageEncoding="utf8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'addwin.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	
	<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{

//  parseInt(String s, int radix) 
 //		使用第二个参数指定的基数,将字符串参数解析为有符号的整数。 Integer中的方法
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>99999) 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: 2px; 

VISIBILITY: hidden; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: 160px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; 

TOP: 1px; HEIGHT: 25px; BACKGROUND-COLOR: #c9d3f3">
<TABLE width="160" height="25" border=0 cellPadding=0 cellSpacing=0 bgColor=#AFDCF3 



style="BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid" >
<TBODY>
<TR bgColor=#6699cc>
<TD style="font-size: 12px; background-image: url('images/msgTopBg.gif'); color: #0f2c8c; top=100, left=100" width=6 height=24 >说的</TD>
<TD width="267" height="20" vAlign=center 
style="font-weight: normal; font-size: 12px; background-image: url('images/msgTopBg.gif'); 

color: #ffffff; padding-left: 4px; padding-top: 4px " ><a href="http://609598174.qzone.qq.com" target="_blank">

-----我的空间------
padding-left: 4px;弹出窗口文字句窗口左边的距离 
padding-top: 4px弹出窗口文字句窗口左边的距离 
</a></TD>
<TD style="background-image: url('images/msgTopBg.gif'); padding-right: 2px; padding-top: 2px" vAlign=center align=right width=26 top=100, left=100>

<span title=关闭 

style="CURSOR: hand;color:white;font-size:12px;font-weight:bold;margin-right:4px;"  top=100, left=100

onclick=closeDiv() ><font color="#000000">×</font></span>

<!--<IMG title=关闭 style="CURSOR: hand" onclick=closeDiv() hspace=3 src="msgClose.jpg">-->

</TD>
</TR>
</TBODY>
</TABLE>
</DIV>


有勇气来改变可以改变的事情,有胸怀来接受不可改变的事情,有智慧来分辨两者的不同!

 

知道事物应该是什么样,说明你是聪明的人;知道事物实际是什么样,说明你是有经验的人;

知道怎样使事物变得更好,说明你是有才能的人。

记得感激每一个帮助你的人啊 <SCRIPT LANGUAGE="JavaScript"> var s = "";

参数说明:
s += "\r\n网页可见区域宽:"+ document.body.clientWidth;

s += "\r\n网页可见区域高:"+ document.body.clientHeight;

s += "\r\n网页可见区域宽:"+ document.body.offsetWidth +" (包括边线和滚动条的宽)";

s += "\r\n网页可见区域高:"+ document.body.offsetHeight +" (包括边线的宽)";

s += "\r\n网页正文全文宽:"+ document.body.scrollWidth;

s += "\r\n网页正文全文高:"+ document.body.scrollHeight;

s += "\r\n网页被卷去的高:"+ document.body.scrollTop;

s += "\r\n网页被卷去的左:"+ document.body.scrollLeft;

s += "\r\n网页正文部分上:"+ window.screenTop;

s += "\r\n网页正文部分左:"+ window.screenLeft;

s += "\r\n屏幕分辨率的高:"+ window.screen.height;

s += "\r\n屏幕分辨率的宽:"+ window.screen.width;

s += "\r\n屏幕可用工作区高度:"+ window.screen.availHeight;

s += "\r\n屏幕可用工作区宽度:"+ window.screen.availWidth;

s += "\r\n你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";

s += "\r\n你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
alert(s);


</SCRIPT>
	

  </head>
  
  <body>
    This is my JSP page. <br>
  </body>
</html>

 

 

0
1
分享到:
评论

相关推荐

    MFC制作的屏幕右下角弹出窗口

    在Windows系统中,我们常常会遇到像QQ那样的屏幕右下角弹出窗口,这些窗口通常用于显示通知、消息或者更新等信息。本文将详细探讨如何使用MFC来实现类似的弹出窗口,并且介绍如何实现样式切换以及支持超链接的功能。...

    右下角弹出窗口实例代码

    在IT行业中,右下角弹出窗口是一种常见的用户体验设计元素,尤其在网页应用和广告展示中。这种设计能够吸引用户的注意力,同时不打断他们的主要浏览体验。本实例代码旨在实现一个兼容IE6+及Firefox浏览器的右下角滑...

    浏览器右下角弹出提示框代码实例

    ### 浏览器右下角弹出提示框代码实例解析 #### 一、概述 本文将详细介绍一个在浏览器右下角显示自定义提示框的JavaScript脚本实例。该实例不仅展示了如何利用`window.createPopup()`方法创建弹出窗口,还涉及了...

    一个类似QQ的用JavaScript实现的在网页右下角弹出窗口源码例子

    2. **用JavaScript在网页右下角弹出窗口.htm**: 这个例子展示了如何利用JavaScript将一个窗口定位到网页的右下角。主要知识点包括: - CSS布局:理解页面坐标系统,使用绝对定位(position: absolute)将元素放置...

    Qt 右下角弹出框

    在Qt编程中,创建一个右下角弹出框可以实现应用程序的通知功能,使得用户在不离开当前工作界面的情况下,能够接收到重要的信息提示。本文将详细介绍如何使用Qt库来实现这个功能,以及相关的编程技巧。 首先,Qt是一...

    基于C#的右下角窗体弹出实例+源代码.

    在本文中,我们将深入探讨如何在C#编程环境中创建一个右下角弹出窗口的实例。这个技术在很多软件应用中都有所应用,比如系统通知、消息提示等。通过学习和理解这一实例,开发者可以更好地掌握Windows Forms应用程序...

    jquery java源码 右下角提示窗口弹出

    本资源"jquery java源码 右下角提示窗口弹出"涉及的核心知识点主要集中在利用jQuery实现一个在屏幕右下角(或者左下角、屏幕中间)弹出提示窗口的动态效果。 首先,我们要理解jQuery的基本用法。jQuery库通过选择器...

    JS实现简单的右下角弹出提示窗口完整实例

    本文所提及的"JS实现简单的右下角弹出提示窗口完整实例",涉及的知识点主要有以下几个方面: 首先,文档类型声明(&lt;!DOCTYPE html&gt;)和HTML结构是构建网页的基础,确保浏览器按照指定的标准去渲染页面。紧接着,...

    jquery做的 右下角弹出信息框

    标题“jquery做的 右下角弹出信息框”提到的功能,是网页交互中常见的一种设计,用于向用户展示提示信息、通知或者广告。这种弹出信息框通常位于页面的右下角,因为这个位置不会遮挡主要内容,同时又容易引起用户的...

    c#桌面右下角弹出窗

    在C#编程中,创建一个桌面右下角弹出窗口是一种常见的用户通知方式,尤其适用于显示简短的信息或提醒。这种技术通常被称为托盘通知或者系统托盘图标。本项目中,开发者通过实现一个不规则形状的弹出窗口,使得其更加...

    计算机右下角弹出窗口

    在Win10系统中,如果你想要在右下角弹出一个提示窗口,可以考虑使用QMessageBox的静态方法,如`QMessageBox::information()`、`QMessageBox::warning()`等。确保正确地连接信号与槽,以便在适当的时间触发弹窗。 2....

    flex仿qq右边弹出提示消息功能

    本项目“flex仿qq右边弹出提示消息功能”旨在模仿QQ聊天软件中的右下角弹出通知功能,为用户提供类似的新消息提醒体验。这种功能在现代Web应用中非常常见,用于展示系统更新、用户通知或重要消息。 首先,我们要...

    易语言源码弹出右下角窗口.rar

    标题中的“易语言源码弹出右下角窗口.rar”指的是一个使用易语言编写的程序源代码,该程序能够实现在操作系统桌面右下角弹出窗口的功能。这个压缩包文件包含了一个名为“弹出右下角窗口”的源代码文件。 在Windows...

    Qt 右下角 弹出窗体

    在Qt编程中,实现右下角弹出窗体的功能是一项常见的需求,这通常涉及到自定义窗口部件(Widget)以及窗口管理。以下将详细介绍如何在Qt中实现这一功能,并结合提供的"PopupWidget"这一文件名,我们可以推测这是一个...

    弹出右下角窗口.rar

    在Windows操作系统中,"弹出右下角窗口"通常指的是系统通知区域的气泡提示,也就是我们常说的任务栏通知。这个区域位于屏幕右下角,是系统和应用程序用来向用户发送临时或非中断性消息的重要途径。下面我们将深入...

    WPF右下角的弹窗提示例子

    4. **显示弹窗**:在需要弹出提示的地方,实例化这个自定义窗口,并调用`ShowDialog`方法以模态方式显示。 ```csharp var alert = new DesktopAlert(); alert.ShowDialog(); ``` 除了上述自定义方法,还可以使用第...

    【精华】页面右下角弹出类似QQ或MSN的消息提示

    标题中的“【精华】页面右下角弹出类似QQ或MSN的消息提示”指的是在网页设计中实现一种类似于即时通讯软件(如QQ、MSN)的消息提示功能。这种功能常见于许多网站,尤其是企业级应用,用于通知用户新消息、提醒或者...

    C#制作右下角滑出的Popup窗口提醒效果

    摘要:C#源码,菜单窗体,右下角,弹出窗口 C#制作一个Popup窗口提醒效果,右下角的弹出窗口,点击“弹出”按钮后,会看到从屏幕的右下角向上滑出一个提示窗口,经常上网的朋友可能会对此功能非常熟悉,网页上实现右下...

    popupform_src.zip_右下角弹出

    通过学习和研究这个源代码包,开发者不仅可以掌握右下角弹出窗口的实现,还能深入理解JavaScript、CSS和前端开发的实践技巧。对于想要提升自己前端技能的开发者来说,这是一个非常有价值的资源。

Global site tag (gtag.js) - Google Analytics