[英]jQuery Waypoints handles the first element with a specified class only
I am trying to implement the jQuery Waypoints plugin to add an .active
class to any element with a .foo
class as it gets into the viewport: 我正在尝试实现jQuery Waypoints插件,以便在进入视口时将
.active
类添加到具有.foo
类的任何元素:
<div class="foo"></div>
<div class="foo"></div>
var inview = new Waypoint.Inview({
element: $('.foo')[0],
entered: function(direction) {
$(this.element).addClass("active");
}
});
JS Fiddle: http://jsfiddle.net/g6mouxnd/ JS小提琴: http : //jsfiddle.net/g6mouxnd/
The example above will add the .active
class to the first .foo
container only. 上面的示例仅将
.active
类添加到第一个.foo
容器中。 How do I make it work for the second and any subsequent .foo
container as well? 如何让它适用于第二个和任何后续的
.foo
容器?
You can loop over every .foo
and create an Inview for each: 您可以遍历每个
.foo
并为每个.foo
创建一个Inview:
$('.foo').each(function() {
new Waypoint.Inview({
element: this,
entered: function(direction) {
$(this.element).addClass('active');
}
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.