javascript - 更改位置时出现 Safari 渲染问题 :fixed to position:relative

Question

我正在开发一个 jQuery 插件，只是为了好玩，它会在您向下滚动页面时显示“堆栈”中的元素。

Github 存储库在这里 - https://github.com/JayBizzle/Reveal

演示在这里 - http://jaybizzle.github.io/Reveal/

在 Chrome 中一切正常，但在 Safari 中测试时我发现了一些奇怪的渲染问题。

如果您在 Safari 中查看演示并快速向下滚动，您会注意到彩色 DIV 之间出现白色间隙。

更奇怪的是，如果您随后检查其中一个位置不正确的 DIV，检查员会突出显示正确位置的 DIV。此外，如果您在检查器中更改了其中一个元素的 CSS 属性，例如添加边框，则页面会重新绘制并且该元素会出现在正确的位置。

如果这是一个 Safari 错误，或者我可以用一些鲜为人知的 CSS 来克服，有人知道吗？

Answer 1

我遇到了类似的问题。 我的解决方法是先给 position static，然后稍微延迟一下 relative。

    $(elem).css('position', 'static');
    setTimeout(function() {
      $(elem).css('position', 'relative');
    }, 1);