jquery 模式对话框改进版

/Files/studyplay/gundong2.rar<!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=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){        
 $("#showx").click(function(){
          diagwindow(800,400,"关闭系统",0,"http://www.baidu.com");
          })
 
 $("#closex").click(function(){
        if($("#jz").length>0)
        {
         $("#jz").remove();
        }
        })

});
function diagwindow(width,height,title,intopacity,url)
{
 if(!$("#jz").length>0)
 {
 var maktemp='<div id="markdiag" style="background:#666;'+$(document).width()-25+'px; height:'+$(document).height()+'px; position:absolute; top:0px; left:0px; z-index:100;"></div>';
 var tempstr ='<div id="jz" style="z-index:101;position:absolute; '+width+'px; height:'+height+'px; border:#666 5px double;"><div style="height:25px; background:#F60; text-align:right; padding-right:10px; color:#FFF; font-size:12px; font-family:Verdana, Geneva, sans-serif; line-height:25px; padding-left:15px;"><span style="float:left;">'+title+'</span><span id="diagclose" style="cursor:hand;">关闭</span></div><div style="padding:5px; height:'+(height-35)+'px; background:#FFF;"><iframe src="'+url+'" frameborder="0" width="100%" height="'+(height-35)+'px" scrolling="no"></iframe></div></div>';
 $("body").append(maktemp);
 $("body").append(tempstr);
 var css={}
      if(window.navigator.userAgent.indexOf('MSIE')>=1)
     {
      css.filter= 'progid:DXImageTransform.Microsoft.Alpha(opacity='+intopacity*100+')';
     }
     else
     {
      css.opacity= intopacity;
     }
     $("#markdiag").css(css);

 }
   var w,h,de;
     de = document.documentElement;
  w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
     h = self.innerHeight || (de&&de.clientHeight)|| document.body.clientHeight;     
 var diagtop = h/2-(height/2)+eval($(document).scrollTop());
 var diagleft = w/2-(width/2)+eval($(document).scrollLeft()); 
 $("#jz").css({"top" : diagtop,"left":diagleft });
  $(window).scroll(function(){
 var diagtop = h/2-(height/2)+eval($(document).scrollTop());
 var diagleft = w/2-(width/2)+eval($(document).scrollLeft()); 
 $("#jz").css({"top" : diagtop,"left":diagleft });
         });
 $("#diagclose").click(function(){
           if($("#jz").length>0)
        {
         $("#jz").remove();
        }
           if($("#markdiag").length>0)
        {
         $("#markdiag").remove();
        }
          
           })
 
}
</script>
</head>
<body>
<p><a href="#" id="showx">11111111111111111111</a> sssssss </p>
<p><a href="#" id="closex">sssssssssssssfdsf</a></p>
<p>ssssssssssssssss</p>
<p>sdf</p>
<div>
  <p>项目位于京东燕郊夏垫开发区,1ddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;02国道路北,乘930路快车仅20分钟便可到;</p>
  <p>02国道路北,乘930路快车仅20分钟便可到;</p>
  <p>达距离国贸!距离首都国际机场仅45分钟车程,交通便利,</p>
  <p>出行畅通无阻;区位优势显而易见!项目紧邻京东第一温泉</p>
  <p>度假村,为社区凝聚了拥有较好的居住氛围。</p>
</div>
<div>
  <p>13万平米低密度社区,由多层、小高层组合而成,</p>
  <p>总户数约600余户,是当地规模最大的住宅群。</p>
</div>
<div>
  <p>规划优势:项目周边林木围绕,社区中间设计有大型活动广</p>
  <p>场,超大楼间距使每套房间均能充分享受阳光的照耀。多层和小</p>
  <p>高层板楼搭配,适中的两居室和小三居室能够满足不同客群的居住需求。</p>
</div>
<div>
  <p>本项目共分三期开发建设,一期工程10楼6层板楼,建筑面积约4.2</p>
  <p>万平方米,共410多套,二期工程为2栋6层板楼、1栋10层的小高</p>
  <p>层和两栋12层的小高层组成,建筑面积约7.5万平方米共688套,</p>
  <p>三期工程计划开发建设两栋6层板楼,建筑面积约1.8万平方米,</p>
  <p>共160多套。项目总建筑面积14.3万平方米。</p>
</div>
</body>
</html>
/Files/studyplay/gundong.rar

原文地址:https://www.cnblogs.com/studyplay/p/1570699.html