使用Chrome加载页面时CSS快照滚动失败

我正在编写一个网站（使用ajaxify.js和history.js），其中包括不同的

，垂直滚动，宽度和高度在屏幕的100%（在我的主页和其他页面上）

为了让导航变得更好，我使用了新的CSS快照滚动功能。它在Safari（第12版）、Firefox（第62版）上运行良好。但使用Chrome（v.69）时，它真的会出错

事实上，当我的主页加载到Chrome上时，快照效果就不起作用了。所以我去查看另一页的效果，它仍然不起作用。。。但是，如果我回来访问我的主页（没有重新加载网站，因为它是在Ajax中），快照效果会工作

我将“snap”类应用于

标记（作为滚动容器），将“snap部分”类应用于

---

这是我的css，我遇到了同样的问题

找到了一个解决方法，在使用jquery加载页面之前不应用“snap type”属性。不得不这样做很烦人，但很有效

请尝试以下操作：

$（'body'）.addClass（'scroll-snap'）
正文{
宽度：100vw；
溢出y：滚动；
}
.滚动捕捉{
-webkit滚动捕捉类型：必填；
-ms滚动捕捉类型：必填；
滚动捕捉类型：必填；
-webkit-scroll-snap-points-y：重复（100vh）；
-ms-scroll-snap-points-y：重复（100vh）；
滚动捕捉点y：重复（100vh）；
-webkit滚动捕捉类型：y必填；
-ms滚动捕捉类型：y必填；
滚动捕捉类型：y必填；
}
剖面{
位置：相对位置；
宽度：100vw；
高度：100vh；
/*你可能会失去机会！很重要*/
滚动捕捉对齐：开始；
}

谢谢您的回答。我尝试了你的解决方案：如果我在Chrome中加载第一个页面（缓存中没有任何内容），它不会工作，但当我刷新页面时它会工作。我无法将苹果与苹果进行比较，因为我使用的是Chrome v 70.0.3538.77-但我可以告诉你，它在缓存完全清除的情况下工作。在PC和mac上的chrome上测试。你在哪里运行脚本？确保它在页面加载后运行。我明白，我没有在Mac电脑上测试它。我正在开发的网站是Wordpress，所以我在页脚中运行脚本（带有JS文件）。在应用该类之前，我有一个2秒的settimeout，它似乎可以工作。谢谢
body {
  width: 100vw;
  overflow-y: scroll;

  -webkit-scroll-snap-type: mandatory;
    -ms-scroll-snap-type: mandatory;
      scroll-snap-type: mandatory;

  -webkit-scroll-snap-points-y: repeat(100vh);
    -ms-scroll-snap-points-y: repeat(100vh);
      scroll-snap-points-y: repeat(100vh);

  -webkit-scroll-snap-type: y mandatory;
    -ms-scroll-snap-type: y mandatory;
      scroll-snap-type: y mandatory;
}

section.snap-section {
  position: relative;
  width: 100vw;
  height: 100vh;

  scroll-snap-align: start !important;
}