zoukankan      html  css  js  c++  java
  • jquery + Css 模式对话框

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
     <head>
      <title>模式对话框示例</title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
         <script src="jquery-1.5.2.min.js" type="text/javascript"></script>
         <script type="text/javascript" language="javascript">
         $(function () {
             $(".selTree").live("click",function () { $(".empTree,.bgDiv").show(); });
             $(".close").live("click",function () {
                $(this).parents(".shq,.box").hide();
                $(".bgDiv").hide();
                });
              
     
         });
         </script>
         <style type="text/css" >
      .bgDiv{position:absolute;top:0px; background:url(../images/divBg2.png); display:none;100%;height:100%}
      .shq{ 507px; height:488px; border:5px solid #219ACF; position:absolute;margin-left:-253px;left:50%;top:60px; background:#EBF3F6; display:none}
      .boxHead{ 100%; height:27px; background:url(../images/box_bg.jpg) repeat-x;}
      .boxHead div{margin-left:10px}
      .shTitle{margin-left:10px; height:25px; line-height:25px; float:left}
      .shClose{20px; cursor:pointer; float:right; color:#94938E; font-weight:bold;font-size:16px;height:25px; line-height:25px;}
        </style>
     </head>
     
     <body>
        <input type="button" id="button" value="模式对话框"  class="selTree" />

        <!--选择查看 -->
        <div class="bgDiv"></div>
            <div class="shq empTree" name="shq" style="height:425px; 425px; display:none">
            <div class="boxHead">
              <div class="shTitle">选择查看</div>
              <div class="shClose close">×</div>
            </div>
                  asdfasdfasdf
                  <input type="submit" name="button2" id="button2" value="确定" class="btn close"/>
                 <input type="submit" name="button3" id="button3" value="取消" class="btn close"/>
        </div>
     </body>
    </html>

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
     <head>
      <title>模式对话框示例</title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
         <script src="jquery-1.5.2.min.js" type="text/javascript"></script>
         <script type="text/javascript" language="javascript">
         $(function () {
             $(".selTree").live("click",function () { $(".bgDiv,.empTree").show(); });
             $(".close").live("click",function () {
                $(this).parents(".shq,.box").hide();
                $(".bgDiv").hide();
                });
                $(".bgDiv").height($(document).height());
                $(".close").live("click",function () {
                   $(this).parents(".shq,.box").hide();
                   $(".bgDiv").hide();
                 });

         });
         </script>
         <style type="text/css" >
      .bgDiv{position:absolute;top:0px; background:url(../images/divBg2.png); display:none;100%;height:100%}
      .shq{ 507px; height:488px; border:5px solid #219ACF; position:absolute;margin-left:-253px;left:50%;top:60px; background:#EBF3F6; display:none}
      .boxHead{ 100%; height:27px; background:url(../images/box_bg.jpg) repeat-x;}
      .boxHead div{margin-left:10px}
      .shTitle{margin-left:10px; height:25px; line-height:25px; float:left}
      .shClose{20px; cursor:pointer; float:right; color:#94938E; font-weight:bold;font-size:16px;height:25px; line-height:25px;}
        </style>
     </head>
     
     <body>
        <input type="button" id="button" value="模式对话框"  class="selTree" />

        <!--选择查看 -->
        <div class="bgDiv"></div>
            <div class="shq empTree" name="shq" style="height:425px; 425px; display:none">
            <div class="boxHead">
              <div class="shTitle">选择查看</div>
              <div class="shClose close">×</div>
            </div>
                  asdfasdfasdf
                  <input type="submit" name="button2" id="button2" value="确定" class="btn close"/>
                 <input type="submit" name="button3" id="button3" value="取消" class="btn close"/>
        </div>
     </body>
    </html>

  • 相关阅读:
    【经典】仙岛求药(一)
    6月份学习记录
    YZM的全排列
    最长公共子序列的长度
    20612统计八连块
    积木城堡
    不同组合数求和
    50136142WXY的百度地图
    50095106扔核弹
    【其他】关于海岛帝国互测系列赛总结
  • 原文地址:https://www.cnblogs.com/suizhikuo/p/2220950.html
Copyright © 2011-2022 走看看