如何保持jQuery UI的日期选择在适当位置（粘在输入控制），而滚动？(How to keep j

阅读关于这个问题有很多后我仍然在如何着手解决问题的黑暗。 为了澄清问题，我想日历与输入控件关联干脆滚动并没有留固定在任何屏幕上的位置。 这里是没有滚动的图像：（这是我想保留的滚动以及什么）

这里是图像滚动时（这不是我想要的）

任何尖端将不胜感激。 更新：这里是一个链接紧密描绘的问题，我想日历坚持到控制，同时滚动。

Answer 1:

我不知道，如果你的公司是一个可滚动的div，但这里出现的问题是jQuery UI的日期选择器不能与HTML内容时可滚动的div内移动。

这里是一个演示小提琴http://jsfiddle.net/joycse06/m6A5q/embedded/result/证明的问题。 点击输入，并尝试滚动该专区。

它的发生是因为jQuery UI的创建任意位置的日历UI absolute relative来document或window不是容器滚动股利。 因此，当滚动的div滚动主窗口的滚动上下文没有改变，因此，日期选择器日历不遵循该div其他HTML元素。

因此，解决办法可以隐藏日历时DIV滚动，它是有道理的，如果输入的是不可见的，你可以隐藏日期选择器日历。 因此，更新后的代码会

var datePicker = $('#datepicker').datepicker();

$(".demo").scroll(function() {
  datePicker.datepicker('hide');
  $('#datepicker').blur();
});

$(window).resize(function() {
  datePicker.datepicker('hide');
  $('#datepicker').blur();
});

当div容器或窗口滚动它会隐藏日期选择器。 这里是工作提琴http://jsfiddle.net/joycse06/m6A5q/2/

我使用的是$('#datepicker').blur(); 因为当用户滚动.demo日历皮，但input仍专注，所以当他向后滚动，他可以变得混乱。 因此，正如我模糊了它，他将不得不点击input再和日期选择器会显示出来。

文章来源: How to keep jquery ui datepicker in place (stick to the input control) while scrolling?