17

我想知道用户在 iphone 上的移动 safari 视口内“滚动”了多远的 x/y 偏移量。

换句话说，如果我（通过 javascript）重新加载当前页面，我想找到我需要传递给 window.scrollTo(...) 以便重新定位文档/视口的值，因为它是当前.

window.pageXOffset 总是报告 0

jquery 的 $('body').scrollTop() 总是报告 0

事件有一个 pageX，但是如果您的手势是向上/向下“轻弹”页面，这不会考虑在您释放手指后发生的页面滚动。也就是说，当手指离开屏幕时它会给我一个点，但这并不总是与页面完成滚动后的位置相匹配。

任何指针？

4

7 回答 7

9

window.pageYOffset应该给你当前的滚动偏移量。如果window.pageXOffset你也需要它。

于 2010-05-03T22:04:05.657 回答
3

我有同样的问题......这成功了：

var scrollX = window.pageXOffset; var scrollY = window.pageYOffset;

从这个问题中得到它：Get current position of the viewport in Mobile (iPhone) Safari

于 2010-12-10T16:05:22.663 回答
3

这确实有效：

var scrollX = window.pageXOffset; 
var scrollY = window.pageYOffset;

如果您在 iFrame 中查看内容（例如，这在 WebViews 中很常见），那么您需要添加父级：

var scrollX = parent.window.pageXOffset;

另请注意，这些值是不可写的。所以要改变滚动位置，你需要使用 window.scrollTo 方法：

var scrollX = window.pageXOffset; 
var scrollY = window.pageYOffset;
window.scrollTo(scrollX -100, scrollY -100);
于 2013-02-22T19:38:11.550 回答
1

你试过纯js的方式吗？

document.body.scrollTop
于 2010-03-24T20:19:13.500 回答
1

这是一个简单的代码，用于查找设备是否为 iphone，并根据某些操作将滚动位置更改为特定位置。仅当我单击并打开图像作为弹出窗口时，我才遇到 iphone 问题，因为垂直滚动比我想要的位置下降。所以我写了这段代码，它解决了这个问题。

if((navigator.userAgent.match(/iPhone|iPad|iPod/i))){
    ('#tutorial-landlord').click(function(){
        window.scroll(100, 1500); // x, y (horizontal, vertical position) 
    });
}

找到滚动位置。只需转到 chrome 中的控制台并为垂直编写 window.scrollY 并查看位置如何变化，因此请记下该数字并将其代替 x 和 y

于 2018-02-08T08:20:22.490 回答
0

我在 iPad 上遇到了同样的问题。只需停用控制台。当控制台在 Safari 中打开时，视口高度会发生变化。

于 2013-01-28T11:03:42.637 回答
0

如果由于某种原因 pageXOffset 和 pageYOffset 失败，解决方案很简单，但相当愚蠢：

// force an element to top left of the page
var topLeftMarker = document.createElement("span");
topLeftMarker.style.position = "absolute";
topLeftMarker.style.left = "0";
topLeftMarker.style.top = "0";

document.body.appendChild(topLeftMarker)

function scrollOffset() {
    // getBoundingClientRect() returns the rectangle of the element in viewport space,
    // which *is* scrollLeft and scrollTop 
    const rect = topLeftMarker.getBoundingClientRect();
    return { x: rect.left, y: rect.top }
}
于 2019-09-12T12:52:01.183 回答