ScrollTrigger.sort

返回值 : 数组​

ScrollTriggers 的内部数组

细节​

对 ScrollTrigger 实例的内部数组进行排序以控制它们的refresh()（计算它们的开始和结束值）。这非常是你不太可能需要做的事情。sort() as long as you create your ScrollTriggers in the order they'd happen on the page (top-to-bottom or left-to-right)...which we 强烈推荐这样做。否则，使用推荐这么做。否则，你可以定义一个refreshPriority在任何你需要在列表中提升或降低位置的 ScrollTriggers 中（这将强制进行一次sort()），或者你可以手动调用ScrollTrigger.sort()方法以确保将固定距离添加到页面下方后续 ScrollTriggers 的start/end值中（这就是顺序很重要的原因）。

例如，如果你创建了一个跨越整个窗口高度的 ScrollTrigger，但随后整个高度，但是之后创建了一个让某个元素固定 300px 的 ScrollTrigger，这将使页面实际变高 300px（假设之后pinSpacingautofalse是垂直滚动的end位置对于全页面的 ScrollTrigger 来说是不正确的。最简单的解决方法是最后创建该 ScrollTrigger，但如果无法做到这一点，请将其refreshPriority设置为一个较低的值，例如-1它将在 ScrollTrigger 列表中的计算顺序上被排得更低refresh()计算顺序上。

你可以使用自己的自定义排序方法，如果不提供任何方法，则会先根据refreshPriority排序，然后根据每个 ScrollTrigger 的start值排序。例如，一个具有refreshPriority: 1的 ScrollTrigger 会比默认优先级refreshPriority: 0更早刷新。你也可以使用负数，并可为多个 ScrollTriggers 分配相同的数字。

如果提供了refreshPriority是定义在任意ScrollTrigger 上的，sort()将强制进行一次Array.sort() 方法的工作方式一样。方法快速转换任何坐标。

示例​

ScrollTrigger.create({
  refreshPriority: -1, // lower priority makes it happen later in the refresh() calculations
  ...
});
ScrollTrigger.create({
  ... // if no refreshPriority is defined, it defaults to 0
});
gsap.to(".class", { // works with tweens/timelines too
  opacity: 1,
  scrollTrigger: {
    refreshPriority: 3, // a higher number makes it happen earlier in the refresh() calculations
    ...
  }
});

ScrollTrigger.sort(); // use the defaults (typically best)

// or use a custom function...
ScrollTrigger.sort((a, b) => a.start - b.start);