incorrect value of getBoundingClientRect() in mobile with pinch zoom
Reported by
loadxd...@gmail.com,
Sep 8 2016
|
||
Issue descriptionSteps to reproduce the problem: 1. go to any website, for example http://tutsplus.com 2. select element, for example logo 3. perform getBoundingClientRect() for this element 4. scroll visual viewport down and perform getBoundingClientRect() 5. move top, make pinch zoom 6. scroll visual viewport down, perform getBoundingClientRect() screencast of problem: http://screencast.com/t/NYeURaoW2 What is the expected behavior? getBoundingClientRect always is relative to the layout viewport or visual viewport What went wrong? without zoom getBoundingClientRect is relative to the visual viewport, after pinch zoom getBoundingClientRect is relative to the layout viewport, BUT if visual viewport scroll down a lot getBoundingClientRect return unclear result (it is not clear to whom it relates (see the screencast)) Did this work before? Yes chrome 36 Chrome version: 52.0.2743.98 Channel: stable OS Version: 5 Flash Version:
,
Sep 19 2016
Thanks for the detailed report. This looks like it's working as intended to me. getBoundingClientRect is always relative to the layout viewport. It's probably easiest to see in a demo: bokan.ca/viewport/index.html When you zoom in, the visual viewport scrolls within the layout viewport so at first getBoundingClientRect.top doesn't change. Once you scroll far enough, the visual viewport reaches the edge of the layout viewport so the layout viewport starts to scroll (the visual viewport is always contained by the layout viewport). In my demo above, zoom in and scroll down in the right box to see what I mean. I'm going to mark this as WontFix since it's working as intended (unless I missed something) but feel free to post if you have other questions or comments.
,
Sep 21 2016
Thanks for the answer. But how i can get position of layout viewport? In FireFox, Edge and other browsers getBoundingClientRect relative to the window. In chrome 36 it was same. Now we cant get absolute position by getBoundingClientRect, how we can get position of layout viewport? Thx.
,
Sep 21 2016
Add an invisible element to the page, position: absolute, left: 0, top: 0 (I think documentElement will also work) and getBoundingClientRect on that, the negative of the x,y is the layout viewport's position. FYI: Edge shares the same behavior as Chrome. |
||
►
Sign in to add a comment |
||
Comment 1 by ppolise...@chromium.org
, Sep 16 2016Status: Available (was: Unconfirmed)