JQuery UI Datepicker 在 之前添加代码 - 搞乱布局

Question

我将 JQuery UI 用于各种用途，其中之一是日期选择器。我注意到它在我的页面末尾添加了这个 div:

<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible" id="ui-datepicker-div"></div>

就在</body>之前标签。在页脚后的页面底部留下了 40 像素左右的空白。

有什么办法可以摆脱它吗？

谢谢!

Answer 1

这是一个容器，用于在您显示小部件时保存小部件的 HTML。当日期选择器不可见时，容器应该完全不可见。如果您玩过主题的 CSS，请尝试恢复它:

/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css