zoukankan      html  css  js  c++  java
  • JQuery-遮罩层

    HTML

    <html>
      <head>
        <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
        <script src="Jquery.js" type="text/javascript"></script>
        <script src="JavaScript.js" type="text/javascript"></script>
      </head>
      <title>Title</title>
      <body>
        <div id="bodydiv">
          <input type="button" id="buttonshow" value="显示" />
          <div id="divpopup">
            <input type="button" id="buttonclose" value="关闭"/>
          </div>
          <div id="divcover">
          </div>
        </div>
      </body>
    </html>

    JS(JavaScript.js)

    $(function(){
      $("#buttonshow").click(function(){
        $("#divcover").css("height",$(document).height());
        $("#divcover,#divpopup").show(1000).css("display","block");
        $("#buttonshow").hide(1000);
        $("#buttonclose").click(function(){
          $("#divcover,#divpopup").hide(1000);
          $("#buttonshow").show(1000);
        });
      });
    });

    CSS(StyleSheet.css)

    #divpopup
    {
      display:none;
      position:fixed;
      z-index:1002;
    }
    #divcover
    {
       100%;
      height: 100%;
      top: 0px;
      left: 0px;
      background-color: Gray;
      position: absolute;
      display: none;
      z-index: 1001;
      opacity:0.50;
    }

    源码下载:http://files.cnblogs.com/zisezhixin/遮罩层.zip

  • 相关阅读:
    C++实现高斯滤波器
    移动通信
    最简单的DLL
    C/C++ 编译和链接过程
    Servlet 详解
    对 Java 集合的巧妙利用
    Java 泛型
    Java 字符编码与解码
    HTTP 400 错误
    a 标签的四种样式
  • 原文地址:https://www.cnblogs.com/zisezhixin/p/4188603.html
Copyright © 2011-2022 走看看