iCheck cases à cocher ne pas afficher

Question

Je ne peux pas obtenir le iCheck iCheckbox plugin à afficher dans n'importe quel navigateur.

Voici une jSFiddle. iCheck dépend de jQuery 1.7+.

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

Je l'ai initialisé sans aucune option:

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

Comme vous pouvez le voir si vous inspectez les DOM, l'élément d'entrée est enveloppée par la div iCheckbox. Toutefois, les éléments <input> et <ins> ont tous leur opacité définie sur 0.

Changer leur opacité via jQuery, vous obtenez ceci: http://jsfiddle.net/buRq7/

Malheureusement, il ne fonctionne toujours pas. Est-ce que quelqu'un a des conseils ou de l'expérience pour que cela fonctionne? J'utilise les rails 4 et le pipeline d'actifs.

EDIT: Je viens de réaliser que je choisi sans bibliothèque (JS pur) comme une option-cadre dans jsFiddle, et il semble fonctionner même sans changer l'opacité (voir: http://jsfiddle.net/buRq7/5/). Cependant, la documentation indique explicitement que cela dépend de jQuery (ou Zepto). Le basculement de l'option framework vers jQuery 1.10.1 conduit à ce que l'iCheckbox ne fonctionne plus à nouveau ... je ne sais pas pourquoi.

Answer 1

juste .iCheck() sans aucun paramètre ne fonctionnera pas. Vous devez les éléments suivants au moins:

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

Answer 2

Je faisais la même question, il pourrait être lié à la version plus récente de jQuery, mais vous devez Précisez le type d'entrée avec votre sélecteur: ​

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

Answer 3

Choisissez une peau et importer le css pour sélectionné:

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

et de charger le iCheck vous pouvez utiliser, par exemple:

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

Vérifiez à l'adresse: http://jsfiddle.net/a4p6kjb9/

Answer 4

Je remarque également que l'utilisation de mauvais fichier css et ne comprenant pas la png correcte peut provoquer ce iCheck ne pas fonctionner correctement.

Donc le fichier css que vous choisissez doit correspondre au checkboxClass et au radioClass que vous avez défini.