viewport support (i.e. proper datepicker placement inside elements with fixed size and overflow: scroll)

[Happi-cat]

The problem

We have next html code (example):

<div id="viewport" style="overflow: scroll; width: 100px; height: 100px">
   <!-- ... a lot of content here .. -->
  <input type="text" class="span2" data-bind="datepicker: birthdayFormat, datepickerOptions: { dataType: 'format', format: 'D/M/YY' }">
   <!-- ... a lot of content here .. -->
</div>

If you click on date field, datepicker will open in wrong place as it uses only input offset and ignores scroll position.

Solution

We can specify viewport element as a container and use it for calculating correct offset for datepicker. (This is what I've added)

[andresmoschini]

Looks nice, merging...

Thanks @Happi-cat!