将jquery datepicker放在页面中心

Question

<input id='cpdate' type='text'>

我想将datepicker水平放置在页面中心，120px垂直放置。

$("#cpdate").datepicker({
    dateFormat: "dd-mm-yy"
    , beforeShow: function() {
        $('.ui-datepicker').css({
            width: '160px'
            , position: 'fixed'
            , left: 'calc(100vw - 80px)'
            , top: '120px'
        });
    }
});

不起作用。日期选择器仍显示在#cpdate父级（右侧边栏）;

中

是的，我看到this，但它对我也不起作用。

Answer 1

您可以向class添加一个CSS，如下所示：

.ui-datepicker {
  width: 160px;
  position: fixed !important;
  left: calc(50vw - 40px) !important;
  top: 120px !important; 
}

<强> Online demo (jsfiddle)