jquery mobile change checkbox farbe

Wie kann ich die checkbox farbe (blau) und checkbox icon farbe (weiß) wenn auf andere farben überprüft.jquery mobile change checkbox farbe

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
 
    <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
    <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 

 
    <form> 
 
     <label> 
 
      <input type="checkbox" name="checkbox-0 ">Check me 
 
     </label> 
 
    </form>

Quelle

2017-11-11 desmondlee

gelten Während die Hintergrundfarbe ändern trivial CSS ist, für das Symbol Farbe, die Sie Farbe zwei Sätze haben: * weiß * und * schwarz *. Sie können * schwarze * Symbole anzeigen, indem Sie die Klasse 'ui-alt-icon' verwenden. Sie können Symbole nicht einfärben, da die Symbole nicht inline angezeigt werden. Hier ist die Referenz für das alternative Icon Set: http://demos.jquerymobile.com/1.4.5/icons/ – deblocker

Für blaue Farbe:

.ui-btn.ui-checkbox-on.ui-btn-a:after { 
    background-color: red !important; 
}

Das weiße Symbol ist ein SVG:

.ui-icon-check:after { 
    background-image: url(newicon.svg); 
}

Quelle

2017-11-11 16:46:32 Nick

Alles, was Sie tun müssen, ist die Klasse zu identifizieren, die verwendet wird, von jquery. Danach können Sie einfach die Eigenschaft wie dieser

.ui-btn.ui-checkbox-on:after { 
 
    background-color: red !important; 
 
} 
 

 
.ui-btn.ui-checkbox-off:after { 
 
    background-color: blue !important; 
 
}

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
 
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> 
 
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 

 
<form> 
 
    <label> 
 
      <input type="checkbox" name="checkbox-0 ">Check me 
 
     </label> 
 
</form>

Quelle

2017-11-11 16:59:32

jquery mobile change checkbox farbe

Antwort

Verwandte Themen