Extensible Html5 Drawing Widget - Literally

File Size: 474 KB
Views Total: 5241
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Extensible Html5 Drawing Widget - Literally

Literally is a an extensible HTML5 drawing widget that currently supports a minimal set of drawing operations. You can draw, erase, set the color with the eyedropper, undo, redo, pan, and zoom. 

Basic Usage:

1. Javascripts

<script src="lib/js/literallycanvas.fat.js"></script>

<script type="text/javascript">
  $(document).ready(function() {
// disable scrolling on touch devices so we can actually draw
$(document).bind('touchmove', function(e) {
  if (e.target === document.documentElement) {
return e.preventDefault();
  }
});

// the only LC-specific thing we have to do
$('.literally').literallycanvas();
  });
</script>

2. Markup

<div class="fs-container">
  <div class="literally"><canvas></canvas></div>
</div>

This awesome jQuery plugin is developed by literallycanvas. For more Advanced Usages, please check the demo page or visit the official website.