`
yangphere
  • 浏览: 77140 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

WEB页面右下角弹出窗口在项目中的应用

阅读更多
<!--把下面代码加到<head>与</head>之间-->

<style type="text/css">
#winpop { width:120px; height:0px; position:absolute; right:0; bottom:0; 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:left;background:#FFF8DC}
.close { position:absolute; right:4px; top:-1px; color:#FF3333; cursor:pointer}
</style>



<script type="text/javascript">
//如果是从数据库中抓符合条件记录来显示
//则将方法tips_pop()方法中传个值就可以了
//function tips_pop(value){
var hide;
function tips_pop(){
     // var orders=value; 这样取的值value就是从数据库中抓出来的值
     var orders='O2008090731;O2008090732;O2008090733;O2008090734;O2008090735;O2008090736';
  view(orders);
  var MsgPop=document.getElementById("winpop");//获取窗口这个对象,即ID为winpop的对象
  var popH=parseInt(MsgPop.style.height);//用parseInt将对象的高度转化为数字,以方便下面比较
   if (popH==0){//如果窗口的高度是0
   MsgPop.style.display="block";//那么将隐藏的窗口显示出来
  hide=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<=160){//如果转化为数值的高度小于等于100
  MsgPop.style.height=(popH+8).toString()+"px";//高度增加4个象素
  }
  else{ 
  clearInterval(hide);//否则就取消这个函数调用,意思就是如果高度超过160象度了,就不再增长了
  }
}
if(str=="down"){
  if (popH>=8)
  {//如果这个参数是down
  MsgPop.style.height=(popH-8).toString()+"px";//那么窗口的高度减少4个象素
  }
  else{//否则
  clearInterval(hide);//否则就取消这个函数调用,意思就是如果高度小于4个象度的时候,就不再减了
  MsgPop.style.display="none";//因为窗口有边框,所以还是可以看见1~2象素没缩进去,这时候就把DIV隐藏掉
  }
}
}
window.onload=function()
{//加载
document.getElementById('winpop').style.height='0px';
setTimeout("tips_pop()",800);//3秒后调用tips_pop()这个函数 setInterval
}


  function view(s) {  
   arry = s.split(";");
   var str = "";
  
   for(i=0;i<arry.length;i++) {
    str = str+"<tr><td><font size=2><a href='/项目名/noresolvedorder.do?method=noresolved&order_no="+arry[i]+"'>"+arry[i]+"</a></font></td></tr>";
   }
   document.all.myorder.innerHTML = "<table><tr><td><font size=2>未处理订单</font></td></tr>"+str+"</table>";
  }

</script>

</head>
<body>
<!--把下面代码加到<body>与</body>之间-->
<span onclick="tips_pop()" style="cursor:hand">查看信息</span>
<div id="winpop">
<div class="title">温馨提示<span class="close" onclick="tips_pop()">X</span></div>
    <!--  <div class="con">未读信息(1)</div> -->
<div id="myorder" class="con">点击这里查看详细</div>
</div>
</body>
分享到:
评论

相关推荐

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -一个典型应用,在Window控件中打开新页面,如果传递的参数不正确,则首先提示参数不对然后关闭此弹出窗口。 -ExtAspNet.Alert.Show("参数错误!", String.Empty, ExtAspNet.ActiveWindow.GetCloseReference());...

    ExtAspNet_v2.3.2_dll

    -一个典型应用,在Window控件中打开新页面,如果传递的参数不正确,则首先提示参数不对然后关闭此弹出窗口。 -ExtAspNet.Alert.Show("参数错误!", String.Empty, ExtAspNet.ActiveWindow.GetCloseReference());...

    JavaScript网页特效范例宝典源码

    1.1 弹出窗口控制 2 实例001 打开新窗口显示广告信息 2 实例002 定时打开窗口 4 实例003 通过按钮创建窗口 5 实例004 自动关闭的广告窗口 6 实例005 控制弹出窗口居中显示 7 实例006 弹出的窗口之Cookie控制 9 实例...

    备忘录模块使用

    备忘录模块使用说明书 配置源程序 附加数据库SQL Server 2000 (1)将DataBase文件夹中的两个文件...添加完备忘信息后,在万年历相应的日期右下角会有个灰色的标记,单击可查看该日期的所有备忘信息。 图1.4 首页日历

    《程序天下:JavaScript实例自学手册》光盘源码

    15.26 始终在屏幕右下角的图片 15.27 可拖动的图片 15.28 等比例缩略图 15.29 用JavaScript导出图像到Excel 15.30 使用VML打造可改变大小的圆框 15.31 JavaScript实现文档结构图 15.32 判断一副图片是否加载完毕 第...

    程序天下:JavaScript实例自学手册

    15.26 始终在屏幕右下角的图片 15.27 可拖动的图片 15.28 等比例缩略图 15.29 用JavaScript导出图像到Excel 15.30 使用VML打造可改变大小的圆框 15.31 JavaScript实现文档结构图 15.32 判断一副图片是否加载完毕 第...

    MicrosoftHTMLHelpWorkshopV1.3汉化版.rar

    首先我们给将来的 chm 文件的窗口标题条指定与 chm 内容相符的文字(如果不指定,则软件默认为“帮助”):按[Project]项目选项中左边第三个按钮“新建/编辑窗口显示风格”,在弹出的窗口类型中随便输入一个名字...

    API之网络函数---整理网络函数及功能

    API之网络函数1. API之网络函数 WNetAddConnection 创建...GetSubMenu 取得一个弹出式菜单的句柄,它位于菜单中指定的位置 GetSystemMenu 取得指定窗口的系统菜单的句柄 HiliteMenuItem 控制顶级菜单条目的加亮显示...

    IIS6.0 IIS,互联网信息服务

    单击右下角的“详细信息”按钮可以打开对话框,在该对话框中我们可以选择需要安装的IIS组件内容。选择完毕后单击“确定”按钮,退回到界面中再单击“下一步”,系统就会开始复制文件。 提示:如果在安装过程中系统...

    PHP开发实战1200例(第1卷).(清华出版.潘凯华.刘中华).part1

    实例212 在页面右下角弹出渐显的广告窗口 268 3.7 状态栏设计 269 实例213 跑马灯文字 269 实例214 状态栏中的收缩显示文字 270 实例215 状态栏中显示数字时钟 271 3.8 导航菜单设计 272 实例216 树状导航菜单 272 ...

    PHP开发实战1200例(第1卷).(清华出版.潘凯华.刘中华).part2

    实例212 在页面右下角弹出渐显的广告窗口 268 3.7 状态栏设计 269 实例213 跑马灯文字 269 实例214 状态栏中的收缩显示文字 270 实例215 状态栏中显示数字时钟 271 3.8 导航菜单设计 272 实例216 树状导航菜单 272 ...

    firefox 14 和网页开发的插件

    安装完成以后,在火狐浏览器右下角会出现一个红色的“叉”或者一个绿色的“勾”,分别表示页面无效和有效。如果在你的页面显示的是绿勾,那恭喜你,你的代码非常规范,如果有错也不用着急,双击红叉标志能够显示错误...

    专科计算机应用基础作业二.doc

    专科计算机应用基础作业二 2012下半年... A:直接在页面上单击右键,按"退出程序"按钮 B:右击任务栏中的IE按钮,在弹出的列表菜单中单击"关闭",可退出正在浏览的IE网页 C:单击窗口右上角的 D:打开任务管理器,在应

    Excel VBA实用技巧大全 附书源码

    04072引用工作表中任意对象左上角、右下角的单元格 04073引用输入了数组公式的所有单元格区域 04074引用输入了某数组公式的单元格区域 04075引用输入了某个函数的全部单元格 04076引用含有特定文本字符串的所有...

    CSS网站布局实录 (第二版)PDF版

    4.1.3 下拉及多级弹出式菜单 4.1.4 门户网站的导航设计(闪客帝国) 4.2 背景控制 4.2.1 背景颜色 4.2.2 背景图片 4.2.3 背景定位 4.2.4 背景滚动 4.2.5 背景属性缩写 4.2.6 基于背景控制的导航优化 4.3 使用列表元素 ...

    IBM WebSphere Portal门户开发笔记01

    18、弹出窗口居中显示JS代码 255 19、CSS渐变样式 256 20、JS READYSTATE 256 21、JS与页面刷新、关闭事件 257 22、SHOWMODALDIALOG和SHOWMODELESSDIALOG及其右下角提示框 257 23、特殊字体样式 258 24、JS确认窗口...

    JavaScript完全自学宝典 源代码

    ajaxmodel.war Ajax实例应用的项目文件(可直接在Tomcat中发布运行)。 \ajaxmodel\amel\html\firstAjax.jsp 显示XMLHttpRequest对象状态。 \ajaxmodel\amel\html\userReg.html 完成验证的客户端页面。...

    H3BPM 试用系统操作手册

    在表单中选择字段【编码】,可以弹出查询窗口,选择值后,且可以自动带出相关字段的值; 2. 联动查询 选择不同的【省份..城市..区县】,观察选择不同数据项时的区别; 3. 字段的计算 【利润】=【营业额】-【成本】;...

    DotNetTextBox所见即所得编辑器控件 v3.3.1

    2) 改进了自定义插件(弹出窗口)的功能,配置中仅需定义页面名称即可,控件会自动识别系统文件夹位置。 3) 优化部分代码。 4) 增加商业版的演示地址。 &lt;br&gt; 2007/8/15 Version 3.3.0 Free &lt;br&gt;...

    《JavaScript实例精通》[源代码]

    6_6.htm 在Web页面中控制其元素的选择状态。 第7章(\7) 示例描述:JavaScript的鼠标事件和键盘事件。 7_1.htm 按钮的鼠标单击事件。 7_2.htm 用鼠标点亮文本。 7_3.htm 渐显图片。 7_4.htm 跟随鼠标的...

Global site tag (gtag.js) - Google Analytics