![](/img/trans.png)
[英]How to change color of custom toolbar button in mozilla firefox extension
[英]How to change background color of toolbar button in javascript which is added in firefox using xul
我已经使用xul在Firefox中添加了工具栏按钮,现在我想在javascript中更改该工具栏按钮的背景颜色。 有人请帮忙
我的xul按钮代码是:
<toolbox id="navigator-toolbox">
<toolbar id="TutTB-Toolbar" toolbarname="Tutorial Toolbar" accesskey="T"
class="chromeclass-toolbar" context="toolbar-context-menu"
hidden="false" persist="hidden">
<toolbaritem flex="0">
<toolbarbutton id="TutTB-Web-Button" tooltiptext="Search"
label="button" oncommand="alert('ok');" />
</toolbaritem>
<toolbarspring />
</toolbar>
</toolbox>
我尝试通过以下代码行在javascript中访问它
var p = document.getElementById("TutTB-Web-Button");
alert(p.textContent);
document.getElementById("TutTB-Web-Button").style.backgroundColor='red';
这很可能与xul元素的默认外观有关。 您必须做-moz-appearance:none
尝试这样:
在您的CSS中:
.myRedClass{
-moz-appearance: none;
background-color:red;
}
在您的JS中:
document.getElementById("TutTB-Web-Button").classList.add('myRedClass');
结果:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.