连接和断开连接的属性

Question

我正在尝试让此处描述的 google 投射按钮完全以编程方式创建，但在涉及连接和断开连接的颜色时也可以在代码中自定义。

cast integration docs

从上面的文档可以看出，您可以设置以下属性来控制两种状态的颜色。

--connected-color && --disconnected-color

由于按钮是以编程方式创建的，因此我必须使用 setAttribute 或类似的东西在投射按钮上创建属性。但是开头的 -- 字符导致 invalidCharacterError 我想知道是否有人遇到过这个？

JSFiddle example

Answer 1

根据你的 jsfiddle 我用 api 创建了另一个 fiddle 很明显 --connected-color && --disconnected-color 是 css变量。 https://jsfiddle.net/karthick6891/up7ugfqd/10/

所以您只需要 chrome 投射按钮的全局样式。

.chromecast-buttonxxxxx {
  --connected-color: blue;
  --disconnected-color: gray;
}

注意：不能设置带有特殊字符的属性名。您必须通过 css.

来控制行为