如果阈值大于0,则相交observer isterterter属性永远不会是错误的



如果我将 threshold值配置为大于0的事物,则当目标离开视口时, isIntersecting永远不会返回false。但是,如果我在0处将默认阈值留在0时,当目标退出视口时,isIntersecting将返回false。请参阅下面的示例,并删除threshold: 1.0

https://jsfiddle.net/snewcomer24/get0a4xr/1/

这似乎是不同的行为。有人对此行为有解释吗?

这是因为仅在元素越过阈值比率时调用您的观察者回调。

默认情况下,阈值为0,因此当元素输入或离开视口时调用回调。当您将阈值更改为1.0时,当元素变为100%可见或停止100%可见时,您的回调为

当元素停止为100%时,它将可见99%,并且仍然具有isIntersectingtrue。然后,当元素离开视口时,它与您的观察者无关(因为您的阈值不是0(,因此您的回调不会再次调用。

如果您关心元素可见100%并离开视口,则可以通过阈值(例如[0, 1.0](将数组传递,并且在越过任何这些比率时会调用您的回调。

https://jsfiddle.net/wzst4jx5/12/

旁边:我最初认为entry.isIntersecting只是entry.intersectionRatio > 0的速记。但是我发现Chrome(65(可以将isIntersecting报告为true,但是intersectionRatio为0,当某些东西非常缓慢地进入视口。

最新更新