javascript – window.scrollTo在Safari中异步工作吗?

前端之家收集整理的这篇文章主要介绍了javascript – window.scrollTo在Safari中异步工作吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
最近我发现很奇怪(在我看来)window.scrollTo行为在Safari(6.0.5(8536.30.1),MacOS 10.8.4).它似乎是异步工作.

我的任务听起来像:

使一些绝对定位的div被固定(定位)
>做一些页滚动
>使以前修改的div绝对定位(取消固定)

所以要取消这个div,我必须执行unpin例程只是在滚动修改完成后.在这里我遇到了这个问题.我检查的每个浏览器都是正确的,除了Safari.

复制步骤:

>在Safari中打开任何网页,并确保它至少可滚动100像素,它的初始滚动偏移量为0
>在开发工具中打开js控制台
> execute:window.scrollTo(0,100);的console.log(的document.body.scrollTop);

输出为0.但是当我将此代码更改为window.scrollTo(0,100); window.setTimeout(function(){console.log(document.body.scrollTop)},1);输出为100,如预期.

这里是我测试过的所有其他浏览器(它工作正常):

> Chrome 27.0.1453.110(MacOS 10.8.4)
> Firefox 21.0(MacOS 10.8.4)
> Opera 12.15 b1748(MacOS 10.8.4)
> IE 8.0.7601.17514(Win7)

那么,一旦我的代码示例不是跨浏览器,在使用jQuery的任何网页上都可以更容易地检查这个行为:

var $w = $(window); 
$w.scrollTop(100); 
console.log($w.scrollTop());

VS

var $w = $(window); 
$w.scrollTop(100); 
window.setTimeout(function() {
    console.log($w.scrollTop())
},1);

这个行为是否正常或是否是错误?如何处理? (现在我修改了$.fn.scrollTop以返回$.Deferred而不是链接,并在除Safari之外的所有浏览器的主线程中立即解析它).

解决方法

实际上,即使使用Safari 6.0.5(在Lion上,即OS X 10.7),我也试图重现您的问题.

您可以使用https://www.browserstack.com/screenshots运行此jsfiddle,以确认它适用于所有Safari版本(5.1,6.0,6.1,7,8).

事实上,spec说,我引用:

When a user agent is to perform a smooth scroll of a scrolling Box Box to position,it must update the scroll position of Box in a user-agent-defined fashion over a user-agent-defined amount of time. When the scroll is completed,the scroll position of Box must be position. The scroll can also be aborted,either by an algorithm or by the user.

除非我正在读错,否则Safari可以在动画动画时给予您旧的价值(或任何东西).因此,如果浏览器想要将其置于极限状态,您的setTimeout方法可能无法正常工作.

原文链接:https://www.f2er.com/js/152907.html

猜你在找的JavaScript相关文章