reveal-frame-component
v0.0.1
Published
A privacy-minded iFrame placeholder component.
Downloads
1
Readme
A privacy-minded iFrame placeholder component.
This component will hide iframes behind a placeholder until the user clicks on it. No request is made until the user clicks on the placeholder. This way, it is possible to ask for consent before an external iframe is being loaded.
Installation
You can use NPM to install this component.
npm i --save reveal-frame-component
Usage
To use this web component in your project you can utilize one of the following styles of syntax.
/* In an existing module / web component */
import 'reveal-frame-component';
/* At top of an application */
<script type="module" src="node_modules/reveal-frame-component/dist/bundle.js"></script>
/* Alternatives for top of application */
<script type="module">
import 'reveal-frame-component';
</script>
Now, you can replace iframe
tags with reveal-frame
and a placeholder text.
<reveal-frame width="560" height="315" src="https://www.youtube.com/embed/4YxTa1AUqps" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" >
<p><b>Click to play.</b></p>
<p>By clicking, data will be sent to YouTube.</p>
</reveal-frame>
Properties
License
MIT