62,046
社区成员
发帖
与我相关
我的任务
分享
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="javascript.aspx.cs" Inherits="javascript右下角信息提醒框.javascript" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
*
{
padding: 0;
margin: 0;
}
li
{
list-style: none;
}
body
{
background: #eee;
}
.float_layer
{
width: 300px;
border: 1px solid #aaaaaa;
display: none;
background: #fff;
}
.float_layer h2
{
height: 25px;
line-height: 25px;
padding-left: 10px;
font-size: 14px;
color: #333;
background: url(title_bg.gif) repeat-x;
border-bottom: 1px solid #aaaaaa;
position: relative;
}
.float_layer .min
{
width: 21px;
height: 20px;
background: url(min.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 25px;
}
.float_layer .min:hover
{
background: url(min.gif) no-repeat 0 0;
}
.float_layer .max
{
width: 21px;
height: 20px;
background: url(max.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 25px;
}
.float_layer .max:hover
{
background: url(max.gif) no-repeat 0 0;
}
.float_layer .close
{
width: 21px;
height: 20px;
background: url(close.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 3px;
}
.float_layer .close:hover
{
background: url(close.gif) no-repeat 0 0;
}
.float_layer .content
{
height: 120px;
overflow: hidden;
font-size: 14px;
line-height: 18px;
color: #666;
text-indent: 28px;
}
.float_layer .wrap
{
padding: 10px;
}
.style1
{
color: #0000FF;
}
</style>
<script type="text/javascript">
function miaovAddEvent(oEle, sEventName, fnHandler) {
if (oEle.attachEvent) {
oEle.attachEvent('on' + sEventName, fnHandler);
}
else {
oEle.addEventListener(sEventName, fnHandler, false);
}
}
function load() {
var oDiv = document.getElementById('miaov_float_layer');
var oBtnMin = document.getElementById('btn_min');
var oBtnClose = document.getElementById('btn_close');
var oDivContent = oDiv.getElementsByTagName('div')[0];
oDiv.style.display = 'block';
var iMaxHeight = 0;
var isIE6 = window.navigator.userAgent.match(/MSIE 6/ig) && !window.navigator.userAgent.match(/MSIE 7|8/ig);
iMaxHeight = oDivContent.offsetHeight;
if (isIE6) {
oDiv.style.position = 'absolute';
repositionAbsolute();
miaovAddEvent(window, 'scroll', repositionAbsolute);
miaovAddEvent(window, 'resize', repositionAbsolute);
}
else {
oDiv.style.position = 'fixed';
repositionFixed();
miaovAddEvent(window, 'resize', repositionFixed);
}
oBtnMin.timer = null;
oBtnMin.isMax = true;
oBtnMin.onclick = function () {
startMove(
oDivContent,
(this.isMax = !this.isMax) ? iMaxHeight : 0,
function () {
oBtnMin.className = oBtnMin.className == 'min' ? 'max' : 'min';
}
);
};
oBtnClose.onclick = function () {
oDiv.style.display = 'none';
};
oDiv.style.display = 'none';
}
function startMove(obj, iTarget, fnCallBackEnd) {
if (obj.timer) {
clearInterval(obj.timer);
}
obj.timer = setInterval(
function () {
doMove(obj, iTarget, fnCallBackEnd);
},
30
);
}
function doMove(obj, iTarget, fnCallBackEnd) {
var iSpeed = (iTarget - obj.offsetHeight) / 8;
if (obj.offsetHeight == iTarget) {
clearInterval(obj.timer);
obj.timer = null;
if (fnCallBackEnd) {
fnCallBackEnd();
}
}
else {
iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
obj.style.height = obj.offsetHeight + iSpeed + 'px';
((window.navigator.userAgent.match(/MSIE 6/ig) && window.navigator.userAgent.match(/MSIE 6/ig).length == 2) ? repositionAbsolute : repositionFixed)()
}
}
function repositionAbsolute() {
var oDiv = document.getElementById('miaov_float_layer');
var left = document.body.scrollLeft || document.documentElement.scrollLeft;
var top = document.body.scrollTop || document.documentElement.scrollTop;
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
oDiv.style.left = left + width - oDiv.offsetWidth + 'px';
oDiv.style.top = top + height - oDiv.offsetHeight + 'px';
}
function repositionFixed() {
var oDiv = document.getElementById('miaov_float_layer');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
oDiv.style.left = width - oDiv.offsetWidth + 'px';
oDiv.style.top = height - oDiv.offsetHeight + 'px';
}
function Do() {
var text = document.getElementById("TextBox1").value;
if (parseInt(text) > 0) {
document.getElementById("Label1").innerHTML = text;
document.getElementById("number").innerHTML = text;
document.getElementById("miaov_float_layer").style.display = "block";
}
else {
document.getElementById("miaov_float_layer").style.display = "none";
}
}
</script>
</head>
<body onload="load()">
<form id="form1" runat="server">
<div class="float_layer" id="miaov_float_layer">
<h2>
<strong>时时数据报警提示</strong> <a id="btn_min" href="javascript:;" class="min"></a><a
id="btn_close" href="javascript:;" class="close"></a>
</h2>
<div class="content">
<div class="wrap">
<a href="www.baidu.com">当前在线报警数量<strong><span id="number">数量</span></strong>请尽快处</a>
<%--<address><span class="MarginLeft10 a">游梁泵数据监测<a href="TWDataMonitorForm.aspx"></a>√</span></address>--%>
</div>
</div>
</div>
报警数量【<asp:Label ID="Label1" runat="server" BackColor="Red"></asp:Label>
】<span class="style1">报警数量大于0就进行js提示</span><br />
报警值填写<asp:TextBox ID="TextBox1" runat="server" ForeColor="Red" Width="69px"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Height="24px" OnClick="Button1_Click" OnClientClick="Do(); return false;" Text="设置报警数量"
Width="100px" />
<br />
<br />
<br />
<br />
<div style="width:732px; height:200px; background-color:Black; color:Green;">
<strong style="font-size:large;">
需要实现的功能不基于Button事件;
<br />
<br />自行判断,提示窗口;
<br />
<br />
前提...我用模板页了 所以希望您能帮我解决这个问题
<br />
<br />
代码上如何改动 写上注释谢谢! 请各位大牛帮忙
</strong></div>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
*
{
padding: 0;
margin: 0;
}
li
{
list-style: none;
}
body
{
background: #eee;
}
.float_layer
{
width: 300px;
border: 1px solid #aaaaaa;
display: none;
background: #fff;
}
.float_layer h2
{
height: 25px;
line-height: 25px;
padding-left: 10px;
font-size: 14px;
color: #333;
background: url(title_bg.gif) repeat-x;
border-bottom: 1px solid #aaaaaa;
position: relative;
}
.float_layer .min
{
width: 21px;
height: 20px;
background: url(min.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 25px;
}
.float_layer .min:hover
{
background: url(min.gif) no-repeat 0 0;
}
.float_layer .max
{
width: 21px;
height: 20px;
background: url(max.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 25px;
}
.float_layer .max:hover
{
background: url(max.gif) no-repeat 0 0;
}
.float_layer .close
{
width: 21px;
height: 20px;
background: url(close.gif) no-repeat 0 bottom;
position: absolute;
top: 2px;
right: 3px;
}
.float_layer .close:hover
{
background: url(close.gif) no-repeat 0 0;
}
.float_layer .content
{
height: 120px;
overflow: hidden;
font-size: 14px;
line-height: 18px;
color: #666;
text-indent: 28px;
}
.float_layer .wrap
{
padding: 10px;
}
.style1
{
color: #0000FF;
}
</style>
<script type="text/javascript">
function miaovAddEvent(oEle, sEventName, fnHandler) {
if (oEle.attachEvent) {
oEle.attachEvent('on' + sEventName, fnHandler);
}
else {
oEle.addEventListener(sEventName, fnHandler, false);
}
}
// 页面加载后
function load() {
// 计算提示框弹出位置
var oDiv = document.getElementById('miaov_float_layer');
var oBtnMin = document.getElementById('btn_min');
var oBtnClose = document.getElementById('btn_close');
var oDivContent = oDiv.getElementsByTagName('div')[0];
oDiv.style.display = 'block';
var iMaxHeight = 0;
var isIE6 = window.navigator.userAgent.match(/MSIE 6/ig) && !window.navigator.userAgent.match(/MSIE 7|8/ig);
iMaxHeight = oDivContent.offsetHeight;
if (isIE6) {
oDiv.style.position = 'absolute';
repositionAbsolute();
miaovAddEvent(window, 'scroll', repositionAbsolute);
miaovAddEvent(window, 'resize', repositionAbsolute);
}
else {
oDiv.style.position = 'fixed';
repositionFixed();
miaovAddEvent(window, 'resize', repositionFixed);
}
oBtnMin.timer = null;
oBtnMin.isMax = true;
oBtnMin.onclick = function () {
startMove(
oDivContent,
(this.isMax = !this.isMax) ? iMaxHeight : 0,
function () {
oBtnMin.className = oBtnMin.className == 'min' ? 'max' : 'min';
}
);
};
// 注册提示框按钮事件
oBtnClose.onclick = function () {
oDiv.style.display = 'none';
};
oDiv.style.display = 'none';
// 模拟更换报警值
setInterval(Change, 1900)
// 每两秒执行一次 Do方法放在这里执行
setInterval(Do, 2000);
}
// 取0-10范围内的随机数
function Change() {
var randNumber = parseInt(Math.random() * 10);
document.getElementById("Label1").innerHTML = randNumber;
}
function startMove(obj, iTarget, fnCallBackEnd) {
if (obj.timer) {
clearInterval(obj.timer);
}
obj.timer = setInterval(
function () {
doMove(obj, iTarget, fnCallBackEnd);
},
30
);
}
function doMove(obj, iTarget, fnCallBackEnd) {
var iSpeed = (iTarget - obj.offsetHeight) / 8;
if (obj.offsetHeight == iTarget) {
clearInterval(obj.timer);
obj.timer = null;
if (fnCallBackEnd) {
fnCallBackEnd();
}
}
else {
iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
obj.style.height = obj.offsetHeight + iSpeed + 'px';
((window.navigator.userAgent.match(/MSIE 6/ig) && window.navigator.userAgent.match(/MSIE 6/ig).length == 2) ? repositionAbsolute : repositionFixed)()
}
}
function repositionAbsolute() {
var oDiv = document.getElementById('miaov_float_layer');
var left = document.body.scrollLeft || document.documentElement.scrollLeft;
var top = document.body.scrollTop || document.documentElement.scrollTop;
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
oDiv.style.left = left + width - oDiv.offsetWidth + 'px';
oDiv.style.top = top + height - oDiv.offsetHeight + 'px';
}
function repositionFixed() {
var oDiv = document.getElementById('miaov_float_layer');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
oDiv.style.left = width - oDiv.offsetWidth + 'px';
oDiv.style.top = height - oDiv.offsetHeight + 'px';
}
function Do() {
var text = document.getElementById("Label1").innerHTML;
// 方便测试,改为大于5提示
if (parseInt(text) > 5) {
document.getElementById("number").innerHTML = text;
document.getElementById("miaov_float_layer").style.display = "block";
}
else {
document.getElementById("miaov_float_layer").style.display = "none";
}
}
</script>
</head>
<body onload="load()">
<form id="form1" runat="server">
<div class="float_layer" id="miaov_float_layer">
<h2>
<strong>时时数据报警提示</strong> <a id="btn_min" href="javascript:;" class="min"></a><a
id="btn_close" href="javascript:;" class="close"></a>
</h2>
<div class="content">
<div class="wrap">
<a href="www.baidu.com">当前在线报警数量<strong><span id="number">数量</span></strong>请尽快处</a>
<%--<address><span class="MarginLeft10 a">游梁泵数据监测<a href="TWDataMonitorForm.aspx"></a>√</span></address>--%>
</div>
</div>
</div>
报警数量【<asp:Label ID="Label1" runat="server" BackColor="Red"></asp:Label>
】<span class="style1">报警数量大于0就进行js提示</span><br />
报警值填写<asp:TextBox ID="TextBox1" runat="server" ForeColor="Red" Width="69px"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Height="24px" OnClientClick="return false;" Text="设置报警数量"
Width="100px" />
<br />
<br />
<br />
<br />
<div style="width:732px; height:200px; background-color:Black; color:Green;">
<strong style="font-size:large;">
需要实现的功能不基于Button事件;
<br />
<br />自行判断,提示窗口;
<br />
<br />
前提...我用模板页了 所以希望您能帮我解决这个问题
<br />
<br />
代码上如何改动 写上注释谢谢! 请各位大牛帮忙
</strong></div>
</form>
</body>
</html>