Submit your widget

make yourself credit card form

Created 4 years ago   Views 10003   downloads 1992    Author jessepollak
make yourself credit card form
View DemoDownload 19.9 KB
46
Share |

The  credit card form is created with pure CSS, HTML, and Javascript — no images required.Card will take any credit card form and make it the best part of the checkout process (without you changing anything). 

If you want to use it, you'll need to include the correct CSS and Javascript files into your HTML. You can find the necessary files at /lib/js/card.js and  /lib/css/card.css and include them in your HTML like so.

<!-- in HEAD -->
<link rel="stylesheet" href="/path/to/card.css">
<!-- at the end of BODY -->
<script src="/path/to/jquery.js"></script>
<script src="/path/to/card.js"></script>

Once you've included those files, you can initialize Card.

$('form').card({
    // a selector or jQuery object for the container
    // where you want the card to appear
    container: '.card-wrapper', // *required*
    numberInput: 'input#number', // optional — default input[name="number"]
    expiryInput: 'input#expiry', // optional — default input[name="expiry"]
    cvcInput: 'input#cvc', // optional — default input[name="cvc"]
    nameInput: 'input#name', // optional - defaults input[name="name"]

    width: 200, // optional — default 350px
    formatting: true // optional - default true

    // Strings for translation - optional
    messages: {
        validDate: 'valid\ndate', // optional - default 'valid\nthru'
        monthYear: 'mm/yyyy', // optional - default 'month/year'
        fullName: 'Say my name' // optional - default 'Full Name'
    }
});

Read more:http://jessepollak.github.io/card/