javascript - 在屏幕中央显示 jQuery 的日期选择器

Question

这是默认生成的代码

<div id="ui-datepicker-div" class="ui-datepicker 
  ui-widget ui-widget-content ui-helper-  clearfix ui-corner-all 
  ui-datepicker-multi ui-datepicker-multi-2" style="width: 34em; 
  position: absolute; left: 349px; top: 453px; z-index: 1; display: block; ">

这个问题是日期选择器显示在触发器输入的旁边，而不是我想要的中心位置。

您可以在此处查看演示站点:http://enniakiosk.spin-demo.com/travelers.php

有谁知道如何使用 javascript 将 .ui-datepicker 类居中？ CSS 显然行不通。

Answer 1

如果您使用的是 .dialog方法它接受一个参数 pos，它是一个 [x, y] 坐标数组(顶部/左侧)，您希望对话框出现的位置。

此解决方案要求您计算顶部和左侧值，以使对话框看起来位于页面中央。这取决于框的大小和视口(viewport)的大小，您可以通过 $(window).height() 和 $(window).width()。您必须即时生成它。