javascript - How to get momentum-based scrolling for the the root <html> element working on iOS Safari? -
we've run problem getting momentum-based scrolling work on ios safari root <html>
element.
the following desired results:
html { height: 100%; overflow-y: scroll; } body { height: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; }
however, scrollbar disappears screen.
tried following suggestion scrollbar, doesn't work.
::-webkit-scrollbar { -webkit-appearance: none; width: 7px; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0,0,0,.5); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); }
this doesn't work either:
body { height: calc(100% + 1px); }
when scrollbar disappears mean scrollbar not exist. following js prints '0', when scrolled half-way down page:
const y = document.body.scrolltop || document.documentelement.scrolltop || document.scrollingelement.scrolltop; console.log(y);
i'm aware momentum-based scrolling on ios safari buggy.
- has managed scrolling working root
<html>
element? - does have suggestions on how scroll value
document.body.scrolltop
?
we're not looking use external libraries.
thanks
Comments
Post a Comment