由于在路上早期重绘，Safari 9.0.3在window.scrollTo（）上出现闪烁问题

Question

我在Safari中遇到了奇怪的行为。

在一个内容丰富的页面上，根据特定的用户操作（需要重新布局并替换页面上的元素），我几乎重建整个文档，然后调用window.scrollTo()将视口移动到计算点。

隔离问题我发现在window.scrollTo()重绘之前（即使JavaScript仍在执行！）然后执行滚动导致闪烁。

首先使用新布局显示文档，然后在新位置显示一帧（使用新布局）。

我探讨了各种各样的“ Safari flickers ”问题（以及答案），但没有一个涉及我遇到的问题。

Answer 1

所描述的行为显然是Safari的一个错误，因为在JavaScript执行终止之前，必须不重绘。

网页具有纯色背景。经过一些实验，我发现使用图像作为背景而不是纯色解决了问题。

主文档大小<div>具有此后台CSS属性：

background: #eee;

用内嵌png（相同颜色的小方块）替换它

background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABlJREFUeNpifPfuHQMpgHFUw6iG4asBIMAAYmAssRRucYsAAAAASUVORK5CYII=") fixed repeat;

避免虚假重绘并消除闪烁。