This time I will share jQuery Plugin and tutorial about Canvas Signature Pad In JavaScript – jQuery sign.js, hope it will help you in programming stack.
sign.js is a jQuery plugin which generates a smooth, mobile-friendly Signature Pad for capturing your signature and saving as an image using HTML5 canvas API.
How to use it:
1. Download and place the main JavaScript file ‘sign.js’ after jQuery.
2 |
integrity = "sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" |
3 |
crossorigin = "anonymous" > |
5 |
< script src = "sign.js" ></ script > |
2. Create a canvas element for the signature pad.
1 |
< canvas id = "myCanvas" ></ canvas > |
3. Create a reset button next to the signature pad.
1 |
< input type = "button" value = "Reset" id = "resetSign" > |
4. Initialzie the signature pad plugin on document read. Done.
1 |
$(document).ready( function () |
4 |
resetButton: $( '#resetSign' ) |
5. Customize the thickness of lines. Default: 10.
1 |
$(document).ready( function () |
4 |
resetButton: $( '#resetSign' ), |
6. Customize the height/width of the signature pad.
1 |
$(document).ready( function () |
4 |
resetButton: $( '#resetSign' ), |
This awesome jQuery plugin is developed by lucasato. For more Advanced Usages, please check the demo page or visit the official website.