Question

您好我正在使用onScreen Plugin更改元素滚动到视口时的类。我想在几秒钟之后删除该类，即使该元素在视口中，并且当该元素不在视口中时，该元素不应该具有类似插件设计方式的类（我认为）。

因此，当用户滚动到元素时，应添加该类以显示该用户正在查找的元素。然后应该在几秒钟后将其删除，以表明它是页面上的常规内容。

我想在插件中注意到，当元素在视口中时，setInterval会不断添加类，所以我试图清除间隔，因此它不会设置类但它不起作用。

$( document ).ready( function() {
    $( function() {
        var id = setInterval( function() { ("#link").removeClass("red").filter(":onScreen").addClass("red").delay(2000).queue(function() {
           $(this).removeClass("red");
            });
        }, 1000 );

   });
   function remove() {
      if ( $("#link").hasClass("red") ) {
          setTimeout(function() { clearInterval( id ); }, 3000 )
          $("#link").removeClass("red");
      }
   }
   remove();

请在几秒后，在显示添加的类之后，在元素处于视口中时帮我删除该类。谢谢你的帮助。

这是Jsfiddle。

Answer 1

我建议你改用plugin。它有两种方法可用于在匹配元素进入或离开视口时对其进行操作：

$('#link').onScreen({
  doIn: function() {
    $(this).addClass('red');
  },
  doOut: function() {
    $(this).removeClass('red');
  }
});

清除onScreen插件中的setInterval以在视口中更改类

1 个答案: