6

我在没有特定选项的情况下初始化了一个 Intersection Observer，因此阈值等于 0.0，并且事件应该在被观察元素的第一个像素进入视口时触发。

这就是当我通过滚动触发观察者时发生的情况，以及当我使用使用简单 CSS 属性（如top. 但是，当观察到的元素出现在视口中时，这要归功于带有过渡动画的 CSS 变换，观察者在动画结束之前不会触发回调。我需要它在元素出现在视口内的那一刻触发，因为它应该是。

你可以在这里看到一个例子：https ://jsfiddle.net/38v2dots/2/

我现实世界的问题是与 CSS 3D 变换一起工作（不必要地）的 carrousel 库。但问题也发生在 2D 变换中。不幸的是，我被迫使用这个库，所以不能避免 3D 变换。

先感谢您。

4

1 回答 1

0

我也有同样的情况。而且我发现，如果您不断移动/单击鼠标，观察者将正常工作。

所以我认为这是维持观察者工作的绘画事件。

然后我在@keyframes 中添加了一些其他属性，它工作正常！如：

@keyframes sidetoside {
  0% {
    transform: translate3d(-400px, 0, 0);
  }
  50% {
    left: 0px;  // 
  }
  100% {
    transform: translate3d(400px, 0, 0);
  }
}
于 2021-10-15T10:08:07.840 回答