Get started with prefixfree CDN
MIT licensed
PrefixFree is a lightweight library that automatically adds vendor prefixes to CSS3 properties for wider browser compatibility.
Tags:- css
Stable version
Copied!
How to start using prefixfree CDN
<!DOCTYPE html>
<html>
<head>
<title>Get started with prefixfree CDN - cdnhub.io</title>
<link rel="stylesheet" href="styles.css">
<script src="https://cdn.cdnhub.io/prefixfree/1.0.7/prefixfree.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
const elements = document.querySelectorAll('[class^="icon-"]');
prefixes = ['webkit', 'moz', 'ms', 'o'];
for (let i = 0; i < elements.length; i++) {
let element = elements[i];
let prefix = '';
for (let j = 0; j < prefixes.length; j++) {
prefix += prefixes[j] + '-';
if (prefixedElement = document.createElement('div')) {
prefixedElement.style.cssText = element.style.cssText;
document.body.appendChild(prefixedElement);
if (prefixedElement.style[prefix + element.className]) {
element.className = prefix + element.className;
break;
}
document.body.removeChild(prefixedElement);
}
}
}
});
</script>
</head>
<body>
<button class="icon-close">Close</button>
<button class="icon-check">Check</button>
</body>
</html>
Copied!