jemz
jemz

Reputation: 5133

iCheck How can I get this working

I am using this plugin to customize radio and checkboxes iCheck I tried to search here in SO but it seems all the solutions is not working for me. so I posted here to get some help, I hope someone can help me to get this working.

here is the code I have right now

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="http://fronteed.com/iCheck/skins/futurico/futurico.css">


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://fronteed.com/iCheck/icheck.js?v=1.0.1"></script>

    <script>
        $(document).ready(function(){
            $('input').iCheck({
                checkboxClass: 'icheckbox_polaris',
                radioClass: 'iradio_polaris',
                increaseArea: '-10%' // optional
            });
        });
    </script>

</head>
<body>

    <input type="checkbox">
    <input type="checkbox" checked>
    <input  type="radio" name="iCheck">
    <input  type="radio"  name="iCheck">


</body>
</html>

Thank you in advance.

Upvotes: 1

Views: 2503

Answers (1)

rrk
rrk

Reputation: 15846

Class name provided is wrong for the theme css you have included. The classes for your theme are icheckbox_futurico and iradio_futurico.

$('input').iCheck({
  checkboxClass: 'icheckbox_futurico',
  radioClass: 'iradio_futurico',
  increaseArea: '-10%'
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://fronteed.com/iCheck/icheck.js"></script>
<link href="http://fronteed.com/iCheck/skins/futurico/futurico.css" rel="stylesheet" />
<div>
<input type="checkbox">
<input type="checkbox" checked>
<input type="radio" name="iCheck">
<input type="radio" name="iCheck">
</div>

Upvotes: 2

Related Questions