当我们点击一个按钮出发蒙层弹窗、弹窗时,想要根据你的浏览器页面控制你的弹窗位置时:

   1.首先获取页面大小高宽:

var X = $(document).height();
var Y = $(document).width();

    2.根据你想将弹窗位置放在哪控制弹窗top  left(以弹窗居中为例)

var XX= ($(document).height()/2)-300;
var YY = ($(document).width()/2)-300;

其中300为你的弹窗高宽的二分之一;

3.通过jquery 根据弹窗ID控制css

$('#weixin_pay_qr').css("top", X);
$('#weixin_pay_qr').css("left", Y);
        $("#weixin_pay_qr").css({
               display : "block"
            });

当然你可以根据你的需求变动弹窗位置

4.最后效果

动态赋值弹窗位置

  缺点是由于是js生成的定值 只有在进入页面时 top left 已经确定 当你在页面缩放时,不会自适应

相关文章: