将弹出窗口设置为以jquery为中心

Set the popup window to center jquery

本文关键字：jquery 为中心 设置 窗口      更新时间：2023-09-26

现在我正在以这种方式设置模态jQuery窗口的位置：

   var winH = $(window).height();
   var winW = $(window).width();
    //Set the popup window to center
    $(id).css('top',  winH/2-$(id).height()/2);
    $(id).css('left', winW/2-$(id).width()/2);

向下滚动时，如何将弹出窗口居中？

您可以使用另一种CSS样式，尝试position: fixed

您可以通过这种方式使用

//将模式框放置在页面的中心

    jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", ( jQuery(window).height() - this.height() ) / 2+jQuery(window).scrollTop() + "px");
    this.css("left", ( jQuery(window).width() - this.width() ) / 2+jQuery(window).scrollLeft() + "px");
    return this;
  }

//然后调用函数

 jQuery(".modal-profile").center();

这将使您的代码组织有序，并易于在任何模式中心项目中使用。你可以在另一个问题中查看这种工作

模态出现在页面加载上

这个帮助了我！

$.fn.center = function() {
    this.css("position", "fixed");
    this.css("top", ($(window).height()/2 - this.height()/2) + "px");
    this.css("left", ($(window).width()/2 - this.width()/2) + "px");
    return this;
}

并按说明使用。

$（".modal window"）.center（）；

假设您使用的是jQuery UI对话框，默认位置是"中心"，默认情况下它在视口中居中。如果您使用的是不同的jQuery模式窗口，那么：

$(id).css({
    'position': 'fixed',
    'top': parseInt((winH / 2) - ($(id).height() / 2), 10)
    'left': parseInt((winW / 2) - ($(id).width() / 2), 10)
});

可能会奏效。我不知道你所说的作为模态对话框的"向下滚动"和滚动（对话框外）是什么意思。

相关文章：