将 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)