search

amsul / pickadate.js

The mobile-friendly, responsive, and lightweight jQuery date & time input picker.
http://amsul.ca/pickadate.js
MIT License
7.7k stars 1.01k forks source link

Use fixed Positioning #1134

Closed MatthewKennedy closed 5 years ago

MatthewKennedy commented 5 years ago

Use fixed positioning to avoid the clipping that is seen when the picker modal is generated inside an element with position relative & overflow set to scroll or hidden.

MatthewKennedy commented 5 years ago

Absolute

Screenshot 2019-03-11 at 14 55 32
MatthewKennedy commented 5 years ago

Fixed Positioning

Screenshot 2019-03-11 at 14 54 31
MatthewKennedy commented 5 years ago

Hi @DanielRuf what is broken on this change?

Fixed position uses the view port as its frame of reference, absolute uses the nearest parent element with position set to relative.

In theory for use as a modal fixed positioning would offer a more sturdy base point.

amsul commented 5 years ago

@MatthewKennedy this is a breaking change because previous versions of this library use position: absolute. It has better usability on mobile (especially older devices).

If your parent element prevents filling the entire window, you might find the container option more suitable for your needs: https://amsul.ca/pickadate.js/date/#container

amsul commented 5 years ago

Not only that, but anyone can add the CSS in this PR to their own stylesheets if that's what they prefer :)

MatthewKennedy commented 5 years ago

Both good suggestions, I'll play around with the container setting from the js.

amsul commented 5 years ago

@MatthewKennedy I'm gonna assume this is safe to close :)