.once also only called once with multiple dom elements
maxschulmeister opened this issue · comments
Hi,
thanks for the simple and awesome module.
I think the purpose of .once is to trigger something only when i comes into the viewport the first time and not if it leaves and comes into the viewport again.
Something similar to scrollReveals "once" function. But, if i bind inview to multiple dom elements, e.g. I have 3 .item divs in my dom. .once will trigger the function for all .item at the same time. I think instead it should trigger the function .once but for every single .item when it comes into the viewport.
By the way: the module also works perfectly if you dont use native scrolling and instead something like virtual-scroll, which is a great plus!
i made a workaround like this for now, but maybe you want to consider implementing it, as i assume its the way its meant to be?
inView('.category-teaser')
.on('enter', el => {
if(!el.done) {
// execute what should be executed only on the first entry for every el
}
})
.on('exit', el => {
el.done = true;
});
@max-schu Thanks for bringing this up! I mulled this over quite a bit in the original implementation. I ended up deciding that once
handlers should, in fact, only be called once. Maybe this is a case for a slightly different method. Something like onceEach
. I'm not sure. 😬
Maybe once
should work like you say, and people can use a remove
method to remove their handler after the first one is called?
I'm now also facing this issue. I really miss a onceEach
method or the once
method should work differently. @max-schu his logic makes sense to me.