2013-08-27 7 views
9

Impossibile visualizzare iCheck iCheckbox plugin in qualsiasi browser.Casella di controllo iCheck non visualizzata

Ecco un jSFiddle. iCheck dipende da jQuery 1.7+.

http://jsfiddle.net/jmj3M/2/

ce l'ho inizializzato senza alcuna opzione:

$(".ex-f").iCheck(); 

Come si può vedere se si ispezionare il DOM, l'elemento di input è di essere avvolto dal div iCheckbox. Entrambi gli elementi <input> e <ins> hanno la loro opacità impostata su 0, tuttavia.

Modifica loro opacità tramite jQuery, si ottiene questo: http://jsfiddle.net/buRq7/

Purtroppo, ancora non funziona. Qualcuno ha qualche consiglio o esperienza su come farlo funzionare?

Utilizzo le guide 4 e la pipeline delle risorse.

EDIT: Ho appena realizzato Ho selezionato no-library (puro JS) come opzione di quadro in jsFiddle, e sembra funzionare anche senza cambiare l'opacità (vedi: http://jsfiddle.net/buRq7/5/). Tuttavia, la documentazione dice esplicitamente che dipende da jQuery (o Zepto). Se si passa dall'opzione framework a jQuery 1.10.1, iCheckbox non funziona più nuovamente ... non è sicuro del motivo.

+0

Hai capito? – cantaffordretail

+0

No, non l'ho mai capito. Non sono stato in grado di esaminarlo molto oltre a quanto detto sopra, forse farò un altro tentativo al più presto. Fammi sapere se lo capisci. – kwyoung11

risposta

18

just. ICheck() senza alcun parametro non funzionerà. Sono necessari i seguenti almeno:

$('input').iCheck({ 
      checkboxClass: 'icheckbox_minimal-grey', 
      radioClass: 'iradio_minimal-grey' 
     }); 
+2

Non hanno mai detto questo nella documentazione: D – Mani

+0

La loro documentazione è piuttosto confusa. Grazie per avermi salvato così tanto tempo! – TheBokiya

1

Così ho avuto lo stesso problema, ma potrebbe essere correlato alla nuova versione di jQuery, ma è necessario specity il tipo di ingresso con il selettore: ​

$("input[type='checkbox'], input[type='radio']").iCheck({ 
    checkboxClass: 'icheckbox_minimal', 
    radioClass: 'iradio_minimal' 
}); 
4

Scegli una pelle e importare il css per un selezionato:

<link href="http://fronteed.com/iCheck/skins/all.css" rel="stylesheet"> 
<script src="http://fronteed.com/iCheck/icheck.js"></script> 

e per caricare l'iCheck è possibile utilizzare, ad esempio:

$(".ex-f").iCheck({ 
    checkboxClass: 'icheckbox_minimal', 
    radioClass: 'iradio_minimal' 
}); 

controllarla: http://jsfiddle.net/a4p6kjb9/

1

ho notato anche che l'uso sbagliato del file css e non tra cui la corretta png può causare questo iCheck non funzionare correttamente.

Quindi il file css scelto deve corrispondere allo checkboxClass e radioClass impostato.