当前位置:编程学习 > JS >>

jquery 弹出遮罩层

<!-- 这是一款利用jquery做的弹出层效果,但这是一款jquery 弹出遮罩层哦,它弹出后其它都被定义为不可操作状态,只要关闭当前弹出的层才能操作。

<!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>
<meta http-equiv="content-type" content="text/html; charset=gbk" />
<title>jquery 弹出遮罩层</title>
<link rel="stylesheet" href="css教程/163css.css" type="text/css" />

  <script type="text/网页特效" src="js/jquery-1.3.2.min.js"></script>
  <script type="text/javascript" src="js/jquery.jmpopups教程-0.5.1.js"></script>
  <script type="text/javascript">
    $.setupjmpopups({
     screenlockerbackground: "#003366",
     screenlockeropacity: "0.5"
    });

    function openstaticpopup() {
     $.openpopuplayer({
      name: "mystaticpopup",
      width: 820,
      target: "myhiddendiv"
     });
    }
  </script>
</head>

<body>
  <div class="box-reg">
  <div class="top-reg">
   新会员注册
  </div>
  <div class="mid-reg">
   <table class="tab02">
   
     <tr>
    <td class="f1"></td>
    <td class="f2">
     <input type="checkbox" class="check" /><span class="agree">我已阅读并同意</span>
     <div id="general">
      <p><a href="javascript:;" onclick="openstaticpopup()" title="static example">《网聚中国服务条款》!(点击打开阅读条款)</a></p>
     </div>
     <div id="myhiddendiv">
      <div class="popup">
       <div class="popup-header">
        <h2>网聚中国 服务条款</h2>
        
       </div>
       <div class="popup-body">
        <strong>请仔细阅读本协议</strong>
        <strong>网聚中国根据以下条件和条款提供您所享有的服务</strong>
        <div class="con">
         
         <p>欢迎阅读"网聚中国"服务条款协议(下称"本协议")。本协议阐述之条款和条件适用于您使用"网聚中国"网站所提供的服务(下称"服务")。</p>
         <b>1. 接受条款。</b>
         <p> 通过首页进入网站http://www.zzzyk.com即表示您同意自己已经与"网聚中国"订立本协议,且您将受本协议的条款和条件("条款") 约束。"网聚中国"可随时自行全权决定更改"条款"。如"条款"有任何变更,"网聚中国"将其网站上刊载公告,通知予您。如您不同意相关变更,必须停止使用"服务"。经修订的"条款"一经在"网聚中国"的公布后,立即自动生效。您继续使用"服务"将表示您接受经修订的"条款"。除另行明确声明外,任何使"服务"范围扩大或功能增强的新内容均受本协议约束。除非经"网聚中国"的授权高层管理人员签订书面协议,本协议不得另行作出修订。</p>
         <b>2.谁可使用 "服务"</b>
         <p> 仅供能够根据相关法律订立具有法律约束力的合约的个人或公司使用。因此,您的年龄必须在十八周岁或以上,才可使用本公司服务。如不符合本项条件,请勿使用"服务"。"网聚中国"可随时自行全权决定拒绝向任何人士提供"服务"。"服务"不会提供</p>
         <p> 仅供能够根据相关法律订立具有法律约束力的合约的个人或公司使用。因此,您的年龄必须在十八周岁或以上,才可使用本公司服务。如不符合本项条件,请勿使用"服务"。"网聚中国"可随时自行全权决定拒绝向任何人士提供"服务"。"服务"不会提供</p>
         <p> 仅供能够根据相关法律订立具有法律约束力的合约的个人或公司使用。因此,您的年龄必须在十八周岁或以上,才可使用本公司服务。如不符合本项条件,请勿使用"服务"。"网聚中国"可随时自行全权决定拒绝向任何人士提供"服务"。"服务"不会提供</p>
        </div>
       </div>
       <a href="javascript:;" class="close" onclick="$.closepopuplayer('mystaticpopup')" title="关闭窗口" >阅读完毕,关闭窗口</a>
      </div>
     </div>
     <div id="fade" class="black_overlay"></div>
    </td>
    <td class="f3"><b class="ts">请确定您已阅读并同意《网聚中国服务条款》!</b></td>
     </tr>
      <tr>
    <td class="f1"></td>
    <td class="f2">
     <a href="#" class="tj">提交注册</a>
    </td>
    <td class="f3"></td>
     </tr>
   </table>
  </div>
  <div class="bot-reg">
   
  </div>
   </div>
</body>
</html>


效果预览
http://g.226511.cn/javascript/js/20100909/div/
源码下载
http://down.zzzyk.com/down/code/jquery/2010/0909/20709.html

补充:网页制作,jquery
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,