# blockenberg/2.0.14/blocks/hotspot-image/frontend.js

Blockenberg — 600+ Advanced Gutenberg Blocks & AI Agent for WordPress Block Editor, version 2.0.14. 33 lines.

- Page: https://pluginprobe.com/plugins/blockenberg/2.0.14/code/blocks/hotspot-image/frontend.js
- Raw: https://pluginprobe.com/plugins/blockenberg/2.0.14/raw/blocks/hotspot-image/frontend.js
- Modified: 2026-10-11T14:39:22+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/blockenberg/2.0.14/code/blocks/hotspot-image/frontend.js#L10-L20`.

```javascript
/* Hotspot Image — frontend.js */
( function () {
  function init() {
    document.querySelectorAll( '.bkhi-wrap' ).forEach( function ( wrap ) {
      const trigger = wrap.dataset.trigger || 'hover';
      const pins    = Array.from( wrap.querySelectorAll( '.bkhi-pin' ) );

      if ( trigger === 'click' ) {
        pins.forEach( function ( pin ) {
          pin.querySelector( '.bkhi-dot' ).addEventListener( 'click', function (e) {
            e.stopPropagation();
            const isActive = pin.classList.contains( 'bkhi-active' );
            // close all
            pins.forEach( p => p.classList.remove( 'bkhi-active' ) );
            if ( ! isActive ) pin.classList.add( 'bkhi-active' );
          } );
        } );
        // click outside closes
        document.addEventListener( 'click', function () {
          pins.forEach( p => p.classList.remove( 'bkhi-active' ) );
        } );
      }
      // hover is handled by CSS :hover
    } );
  }

  if ( document.readyState === 'loading' ) {
    document.addEventListener( 'DOMContentLoaded', init );
  } else {
    init();
  }
}() );

```