2

我发现这是大多数 jquery 模式弹出框的问题。所以我想知道，是否有任何 jquery 代码可以使 jquery 模态始终位于页面中心？我知道这可以用纯 javascript 代码来实现，但是 jquery 呢？

4

3 回答 3

1

如果您使用的是自定义模式，一些可能对您有帮助的样式是：

<div id="modal"></div>

#modal {
    position: fixed;
    height: 80px;
    width: 200px;
    left: 50%;
    top: 50%;
    margin-left: -40px;
    margin-right: -100px;
}

“位置：固定”将模式保持在基于窗口的某个位置。高度和宽度显然提供了大小，而 left/margin-left 和 top/margin-top 实际上是居中的。margin-left 和 margin-top 必须分别是宽度/高度的负一半。

于 2012-07-07T00:19:57.227 回答
1

如果你想用 jQuery 使元素居中，试试这个；

var browserW = $(window).width();
var centerEle = (browserW - 960) / 2; //if ur website design's width 960

$('.centeredEle').css({'left':centerEle + 'px'});//or margin-left, ur choise
于 2012-07-07T00:28:29.963 回答
1

如果您对 jquery 感到满意..您可以使用以下 jquery 函数

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
    return this;
}
于 2012-07-07T05:01:33.553 回答