Wie ändere ich die Hintergrundfarbe im benutzerdefinierten Bootstrap-Switcher-Kontrollkästchen?

Question

Ich habe ein Kontrollkästchen im Bootstrap Switcher Plugin (https://github.com/nostalgiaz/bootstrap-switch) angepasst. Wie ändert man die grüne Farbe beim Umschalten auf rot? dies versucht:

$(".bootstrap-switch").click(function() { 
    $(this).toggleClass("highlight"); console.log('1111'); 
}); 

Mein Beispiel: http://codepen.io/rinatoptimus/pen/JEOjjp

Answer 1

Sie können onColor und/oder offColor mit den Optionen arbeiten. Zuerst müssen Sie Ihre css Klasse auf diese Weise definieren:

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-highlight { 
    background-color: red !important; 
} 

Dann können Sie die Option hinzufügen onColor oder offColor bei der Initialisierung:

$("[name='my-checkbox']").bootstrapSwitch('onColor','highlight'); 

ich in Ihrem Beispielcode versucht, aber es funktionierte nicht vollständig. Ich weiß nicht, was Sie im Standardcode bootstrap-switch geändert haben.