Img2Blob.js

Lightweight javascript-based. Convert internal image url to blob url & add watermark.

HTML

<h3>Default</h3> <img class="sample1" data-img2blob="img/1.png" /> <img class="sample1" data-img2blob="img/2.jpg" /> 
<hr>
 
<h3>With Watermark</h3> <img class="sample2" data-img2blob="img/1.png" /> <img class="sample2" data-img2blob="img/2.jpg" />

Js

<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="js/img2blob.js"></script>         <script> $(function() { 
// default $(".sample1").img2blob();  // with watermark $(".sample2").img2blob({     watermark: '@bachors',     fontStyle: 'Arial',     fontSize: '30', // px     fontColor: '#333', // default 'black'     fontX: 50, // The x coordinate where to start painting the text     fontY: 50 // The y coordinate where to start painting the text }); 
 
}); </script>

Result

blob:http://...