Skip to content

Instantly share code, notes, and snippets.

@nfreear

nfreear/caniuse-multi.js.html

Last active October 12, 2018 12:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nfreear/3db043158100478b28d43cd1f1236a5a to your computer and use it in GitHub Desktop.
Save nfreear/3db043158100478b28d43cd1f1236a5a to your computer and use it in GitHub Desktop.
Download ZIP
Raw
caniuse-multi.js.html
<!doctype html> <title> Compatibility - Can I Use — multi </title>
<style>
iframe[ src *= caniuse ] { border: none; height: 347px; width: 100%; }
</style>
<h1> Can I Use — multi </h1>
<div id="caniuse-multi"> <p> Javascript required. </div>
<p>Powered by <a href="https://caniuse.com/#index" data-caniuse-feature-multi="FileReader,Promises,const,SVG-HTML,WAI-ARIA">Can I Use</a> & <a href="https://caniuse.bitsofco.de/">The CanIUse Embed</a>.</p>
<script>
(function (W, D, dataSelector, selector, periods) {
const HOLDER = D.querySelector(selector);
const FEATURES = D.querySelector(dataSelector).dataset.caniuseFeatureMulti.split(',');
const TEMPLATE = '<p class="ciu_embed"><iframe src="https://caniuse.bitsofco.de/embed/index.html?feat={feat}&periods={periods}&accessible-colours=false"></iframe></p>';
let list = [];
FEATURES.forEach(function (feat) {
list.push(TEMPLATE.replace(/\{feat\}/g, feat.toLowerCase()).replace('{periods}', periods));
});
HOLDER.innerHTML = list.join('\n');
console.warn('Features:', FEATURES);
})(window, document, '[ data-caniuse-feature-multi ]', '#caniuse-multi', 'future_1,current,past_1');
</script>
<!-- <script src="https://cdn.jsdelivr.net/gh/ireade/caniuse-embed/caniuse-embed.min.js"></script> -->
<pre>
© Nick Freear, 12-Oct-2018 | License: MIT.
* https://gist.github.com/nfreear/3db043158100478b28d43cd1f1236a5a
* https://caniuse.bitsofco.de/
* https://github.com/IET-OU/our-journey/issues/7#issuecomment-429280017
</pre>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment