You are here : / / Dijital İmza JS

Dijital İmza JS

Dijital olarak imza atabildiğiniz bir javascript.
Mobil tablet ve bilgisayardan imza alabileceğiniz örnek.


İmza, uygulama kütüphanesi ve örnek link.
https://github.com/thread-pond/signature-pad

Jpg kaydetme uygulama ve örnek link.
http://jsfiddle.net/kyjs655r/399/

jpg kaydetmek için kutuphane
https://html2canvas.hertzen.com/

js kutuphanelerini indirin ve çalıştırın.

<div class="col-md-6 col-sm-4 col-xs-4">
<div class="sigPad" id="smoothed-variableStrokeWidth" style="width:404px;">
<ul class="sigNav">
<li class="clearButton"><a href="#clear">Sil</a></li>
 </ul>
 <div class="sig sigWrapper" style="height:auto;">
 <div class="typed"></div>
 <canvas class="pad" width="400" height="300"></canvas>
 <input type="hidden" name="output-3" class="output">
</div>
</div>
</div>

<input onclick="ciktiGor()" class="btn btn-md btn-info" value="Çıktıyı Gör">
<a id="btn-Convert-Html2Image" href="#">İndir</a>

<script>
$(document).ready(function() {
    $('#smoothed-variableStrokeWidth').signaturePad({drawOnly:true, drawBezierCurves:true, variableStrokeWidth:true, lineTop:200});

});

function ciktiGor(){
   var element = $(".sigPad");
   prevView();
}

function prevView(){
    html2canvas(element, {
         onrendered: function (canvas) {
                $("#previewImage").append(canvas);
                getCanvas = canvas;
            }
         });
}

$("#btn-Convert-Html2Image").on('click', function () {
    var imgageData = getCanvas.toDataURL("image/png");
    // Now browser starts downloading it instead of just showing it
    var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
    $("#btn-Convert-Html2Image").attr("download", "your_pic_name.png").attr("href", newData);
});

</script>

Related Posts

Dijital İmza JS
4/ 5
Oleh
Pada