在错误的时间以类名加载屏幕插件

Onscreen plugin loading in classnames at wrong time

本文关键字：加载 屏幕 插件 错误 时间      更新时间：2023-09-26

这个屏幕插件的目的是只在元素位于视口中时将类名添加到元素中，但它似乎是在页面加载后立即添加类名，这并不是目的。

$(function() {
  setInterval(function() {
  $("#star").filter(":onScreen").addClass('animated bounceInRight');
  }, 0)                             
})

我在这个插件中使用它，这是一个图书效果插件，我认为它在某种程度上与屏幕冲突：http://pastebin.com/UmyJ6zBW这个插件需要在一个页面上有不同的部分才能工作。当在第一部分中使用时，Onscreen可以工作，但当在其他不在视图中时，它会中断。我该如何解决这个问题？

您可以做以下三件事中的一件。

  1. 别麻烦了。通常，您不需要担心视图中没有的元素的样式
  2. 使用setInterval()，但将间隔减小到最小可接受值，但不小于约20ms
  3. [首选]建立一个事件处理程序，该事件处理程序可响应任何导致#star元素在屏幕上/屏幕外移动的事件

对于第三种方法：

  • jQuery动画提供了一个step回调，该回调在执行每个动画步骤时触发
  • 由于滚动文档也会导致元素进入/离开视图，因此您可能还需要scroll处理程序

小心，您应该能够编写一个函数并将其用于两个目的。

相关文章：