Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Custom checkbox using jquery

    • 0
    • 4
    • 4
    • 1
    • 0
    • 0
    • 0
    • 0
    • 1.33k
    Comment on it

    Hello Reader !

    Here is an example how to make a custom check box using simple script and css.

    Script

    $(document).ready(function(){
     $('label').click(function(){
        $(this).toggleClass('checkedN');
     });
    });
    

    css

    .checkedN {background-position:0 53px}
    input[type=checkbox]{opacity: 0;height: 53px;width: 53px}
    label{height: 53px;width: 53px;background: url(check.png);display: block;}
    

    Html

    <label for="">
        <input type="checkbox" name="" value="" class="checkedBtn"> 
    </label>
    

    You can use check box image according to your need

    and add this before this scripiting :-

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: