电脑中设置弹窗的相关代码
电脑中设置弹窗的相关代码
  复制代码 代码如下:
  //窗口的高度
  var windowHeight;
  //窗口的宽度
  var windowWidth;
  //弹窗的'高度
  var popHeight;
  //弹窗的宽度
  var popWidth;
  //滚动条滚动的高度
  var scrollTop;
  //滚动条滚动的宽度
  var scrollleft;
  //延时的时间
  var timeout;
  function init(){
  //获得窗口的高度
  windowHeight=$(window).height();
  //获得窗口的宽度
  windowWidth=$(window).width();
  //获得弹窗的高度
  popHeight=$(".window").height();
  //获得弹窗的宽度
  popWidht=$(".window").width();
  //获得滚动条的高度
  scrollTop=$(window).scrollTop();
  //获得滚动条的宽度
  scrollleft=$(window).scrollLeft();
  }
  //定义关闭窗口
  function closeWindow(){
  $(".title img").click(function (){
  $(this).parent().parent().hide("slow");
  });
  }
  //定义弹出窗口的方法
  function popcenterWindow(){自动弹窗代码
  //先清空上一次的延迟
  clearTimeout(timeout);
  timeout=setTimeout(function (){
  init();
  var popY=(windowHeight-popHeight)/2+scrollTop;
  var popX=(windowWidth-popWidht)/2+scrollleft;
  $("#center").animate({top:popY,left:popX},300).show("slow");},300);
  closeWindow();
  }
  function popleftWindow(){
  clearTimeout(timeout);
  timeout=setTimeout(function (){
  init();
  var popY=windowHeight+scrollTop-popHeight-10;
  var popX=scrollleft-5;
  $("#left").animate({top:popY,left:popX},300).show("slow");},300);
  closeWindow();
  }
  function poprightWindow(){
  clearTimeout(timeout);
  timeout=setTimeout(function (){
  init();
  var popY=windowHeight-popHeight+scrollTop-10;
  var popX=windowWidth-popWidht+scrollleft-10;
  $("#right").animate({top:popY,left:popX},300).show("slow");},300);
  closeWindow();
  }
  CSS
  复制代码 代码如下:
  .window{
  width:250px;
  background-color:#3FF;
  padding:2px;
  margin:5px;
  position:absolute;
  display:none;
  }
  .content{
  height:150px;
  background-color:#FFF;
  padding:2px;
  font-size:14px;
  overflow:auto;
  }
  .title{
  padding:2px;
  color:#999;
  font-size:14px;
  }
  .title img{
  float:right;
  cursor:pointer;
  }

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。