prefix
Prefixes a CSS property based on the current browser.
- Use
Array.prototype.findIndex()
on an array of vendor prefix strings to test ifDocument.body
has one of them defined in itsCSSStyleDeclaration
object, otherwise returnnull
. - Use
String.prototype.charAt()
andString.prototype.toUpperCase()
to capitalize the property, which will be appended to the vendor prefix string.
const prefix = prop => {
const capitalizedProp = prop.charAt(0).toUpperCase() + prop.slice(1);
const prefixes = ['', 'webkit', 'moz', 'ms', 'o'];
const i = prefixes.findIndex(
prefix =>
typeof document.body.style[prefix ? prefix + capitalizedProp : prop] !==
'undefined'
);
return i !== -1 ? (i === 0 ? prop : prefixes[i] + capitalizedProp) : null;
};