如何自定义bootstrap开关颜色

Question

如何将自举开关颜色自定义为所需颜色？

我发现了一个oncolor,offcolor但不知道如何改变它们.

Answer 1

根据这个页面,每个选项也是一种方法.所以你可以像这样应用onColor和OffColor:

$("#sw").bootstrapSwitch({onColor: 'danger'});

或者像那样:

$("#sw").bootstrapSwitch();
...
$("#sw").bootstrapSwitch('onColor', 'danger');

或覆盖库的默认选项:

$.fn.bootstrapSwitch.defaults.onColor = 'danger';

要使用自己的颜色,您需要创建自己的CSS类.例如,此类使用'retroorange'名称和您的颜色:

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-retroorange,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-retroorange {
  color: #fff;
  background: #ff9933;
}

然后你可以'retroorange'像往常一样使用:

$("#sw").bootstrapSwitch({onColor: 'retroorange'});