Chinaunix首页 | 论坛 | 博客

Leungffy XUExueliangfei.blog.chinaunix.net

首页　| 　博文目录　| 　关于我

xueliangfei

  • 博客访问： 2297604
  • 博文数量： 252
  • 博客积分： 5472
  • 博客等级： 大校
  • 技术积分： 3107
  • 用 户 组： 普通用户
  • 注册时间： 2011-09-17 18:39
文章分类

全部博文（252）

文章存档

2012年（96）

2011年（156）

我的朋友
最近访客
推荐博文
相关博文
基本的web桌面操作。网页打开JS网页

分类： 系统运维

2011-12-05 16:28:34

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%
  3. String path = request.getContextPath();
  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
  5. %>

  7. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
  8. <html xmlns="">
  9. <head>
  10. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  11. <title>登陆界面</title>
  12. <script language=javascript type=text/javascript>
  13.   Shade = new function() { /*新建一个Shade函数，当隐藏图层显示时，将网页后面变暗*/
  14.     var handle = {};
  15.     var shade;
  16.     handle.show = function() {
  17.         if (!shade) {
  18.             shade = document.createElement('div'); /*新建一个div元件*/
  19.             shade.className = 'tb-shade'; /*设置shade区CSS为’tb-shade’，名称和第三步中的一致*/
  20.             document.body.appendChild(shade);
  21.         }        with((document.compatMode=='CSS1Compat')?document.documentElement:document.body) {
  22.             var ch = clientHeight, sh = scrollHeight;
  23.             shade.style.height = (sh > ch ? sh : ch) + 'px';
  24.             shade.style.width = offsetWidth + 'px';
  25.             shade.style.display = 'block';
  26.         }
  27.     };
  28.     handle.hide = function() {
  29.         shade.style.display = 'none';
  30.     };
  31.     return handle;
  32.  }
  33.  function showPanel() { /*显示panel函数*/
  34.      Shade.show();/* 执行Shade.show()命令，即后面为暗色*/
  35.      document.getElementById('Panel').style.display = 'block'; /*这里的Panel应和隐藏图层内名称一致 */
  36.      document.getElementById('frame').src = ""; /*设置frame的源，可自行修改，同时“frame”名称和隐藏图层内一致*/
  37.      document.getElementById('Panel').scrollIntoView();
  38.  }
  39.  function hidePanel() { /*隐藏panel函数 */
  40.      Shade.hide();/*执行Shade.hide命令，暗色消失*/
  41.      document.getElementById('Panel').style.display = 'none'; /*将隐藏图层CSS设置为none，即不显示*/
  42.  }
  43. </script>    


  46. <style>
  47. .tb-shade {DISPLAY: none; Z-INDEX: 2007; FILTER: alpha(opacity=60); LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #ccc; opacity: .6}/*z-index可自行修改，但必须比#Panel的值要小，filter中的alpha控制显示透明透，可自行调整*/
  48. #Panel {    MARGIN-TOP: -260px; DISPLAY: none; Z-INDEX: 2008; LEFT: 50%; MARGIN-LEFT: -325px; WIDTH: 650px; POSITION: absolute; TOP: 50%; BACKGROUND-COLOR: #fff}/*设置隐藏层位置、宽度，可自行修改*/
  49. </style>
  50. </head>
  51. <body>

  53. <div id=Panel style="DISPLAY: none">
  54. <a style="display: block; float: right" onclick=hidePanel(); href="#">【关闭】</a>
  55. <iframe id=frame style="OVERFLOW-X: hidden" src="about:blank" frameborder=0 width=650 scrolling=no height=400></iframe>
  56. </div>




  61. <a href="#" onclick="showPanel(); return false;"><strong>代码测试</strong></a>
  62. </body>
  63. </html>
阅读(1001) | 评论(0) | 转发(0) |
0

上一篇：javaBean实现分页显示

下一篇：简单的shell script：循环测试网络状态

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6