Airhorn Web Component.
Quick, load the demo! 📢
Distributed as an ES6 module.
Requires Custom Elements and Shadow DOM.
Usage
<airhorn-overlay>
This content is fine, but if you click on me, I'll become very loud.
</airhorn-overlay>
Set the disabled
attribute to disable the airhorn.
Additionally, set overflow: hidden
on the CSS of element to 'contain' the airhorn to its bounds, rather than expanding out onto the page.
Install
Install airhorn-overlay
on NPM and include the ES6 module:
import {AirhornOverlayElement} from './node_modules/airhorn-overlay/airhorn-overlay.js';
import `airhorn-overlay`;