javascript 中的供应商前缀 css3 属性

Vendor Prefix css3 properties in javascript

本文关键字：css3 属性 前缀 供应商 javascript      更新时间：2023-09-26

我正在尝试添加动画持续时间的css3属性，分别是网格的高度和宽度。我用这个代码div.style.animationDuration做了它。它对我有好处。

我关心的是如何在 js 中为动画持续时间添加供应商前缀 css3 属性，例如 -ms-animation-duration

通常，

JavaScript for css 中的供应商前缀如下：

  1. moz for Mozilla Firefox

  2. 适用于谷歌浏览器、苹果野生动物园和其他基于 Webkit 的浏览器

  3. ms for Microsoft Internet Explorer

  4. o 歌剧

    因此，您可以将div.style.animationDuration替换为div.style.webkitAnimationDuration

要处理这个问题，您可以编写一个方法

function setVendorCss(element, property, value) {
  element.style["webkit" + property] = value;
  element.style["moz" + property] = value;
  element.style["ms" + property] = value;
  element.style["o" + property] = value;
}

在此处阅读更多内容 https://www.kirupa.com/html5/vendor_prefixes_javascript.htm

而不是

像这样选择元素：

element.style.color = 'red';
element.style.fontSize = '2em';

尝试：

element.style.cssText = 'color: red; font-size: 2em';

style.cssText 对于一次添加多个样式很有用，即使是需要前缀的更棘手的样式。

相关文章：