在extjs中显示图像而不是选中复选框的状态

Question

当用户检查图像时，如何显示图像（勾选图像）而不是默认勾选复选框？

我尝试使用checkedCls配置，其中图片即将出现，但复选框背面。

checkedCls: 'checkedBoxStyle'

---

 .checkedBoxStyle{
       background-image:url('http://www.chathamhouse.org/sites/default/files/public/images/buttons/tick-icon.png');
       background-repeat:no-repeat;
 }

jsfiddle开始。

Answer 1

嗯，图像只用

改变其背景位置

.x-form-cb-checked {
     background-position: 0 -13px;
}

原点图像如下所示：

你应该在这里改变整个图像。

我建议更改Base类并强制覆盖

像这样：

.newBase input{
    background-image:url('../resources/images/checkBox_Tick_Mark.png') !Important;
}

在配置

中

...
baseCls: 'newBase',
...

查看您的 JSFiddle （图片路径不正确，但它应该向您展示技巧）