winkblue

winkblue

An DOM element detector which API compatible to sentinel-js

Installation

CDN

<script src="https://unpkg.com/winkblue@0.0.5/dist/winkblue.umd.js"></script>

CDN + ESM

<script type="importmap">
  {
    "imports": {
      "winkblue": "https://esm.sh/winkblue"
    }
  }
</script>

<script type="module">
  import winkblue from 'winkblue';
</script>

Usage

winkblue.on('.dynamic-load-components', (el) => {
  // do something on `el`
});

Why?

1. sentinel-js can not find the display: none; elements.
2. sentinel-js can not trigger multiple times if multiple selectors match the same element.
3. sentinel-js can not work with multiple instances.

Limitation

1. if you reuse the same element instance, the callback will not be triggered.

Playground

1. simple usage
2. hidden elements
3. fizzbuzz
4. multiple instance
5. blink
6. scattergun

LICENSE

ISC