Example of destory about onscreen HOT 3 CLOSED

It's pretty straight forward. In all snippets os is the OnScreen instance:

const os = new OnScreen();

os.on('enter', '.selector', element => console.log(element));
os.destroy();

from onscreen.

I was referring to the following scenario:

1. You assign the on enter for a set of elements, ".selector"
2. When a specific element from the set has entered the viewport, perform the "doIt" function
3. Remove the "enter" event for the element from the specific element from the set, only for the element that has finished loading, not the entire ".selector"

from onscreen.

The implementation of that scenario is up to the developer. I would suggest having some kind of flag that you check while running the "doIt" function…

const os = new OnScreen();

os.on('enter', '.selector', (element) => {
    if (!element.entered) {
        // Write whatever you want to do with the `element`

        // Set the flag so this code block won't run next time the `element` enters the viewport
        element.entered = true;
    }
});

In the above snippet element is an instance of DOMElement. I added a new property to the element object to track if it entered the viewport before. If you don't want to add properties to element you could add a new attribute instead:

os.on('enter', '.selector', (element) => {
    if (!element.getAttribute('entered')) {
        // Write whatever you want to do with the `element`

        // Set the flag so this code block won't run next time the `element` enters the viewport
        element.setAttribute('entered', true);
    }
});

In your scenario, .destroy() isn't needed at all. What .destroy() does is removing the event listener from the window (or HTMLElement if you're using a different container) object. Once you remove the event listener you can add again it using .attach().

from onscreen.