#PaintPane.js
PaintPane is A jQuery paint plugin for a simple drawing surface that you can easily pop into your pages.
-
First,You should include jQuery on your page.
Please make sure that the
jQueryversion you are using is 1.7+,or it maybe doesn't work well.<script src="http://code.jquery.com/jquery.min.js"></script>
-
Include the plugin
paintPaneon your page.<script src="jquery.paintPane.min.js"></script>
-
Now just use jQuery as expected and watch it work at your website.
<script>$('#canvas').paintPane();</script>
Settings are available per plugin. Meaning only when that plugin is included will those settings be available.
$.fn.paintPane.defaults = { defaultBrushSize: 8, // setting the initial size of the brush maxBrushSize: 50, // the attribute will be work if the mode isset "crayon" or "ink" inkAmount: 5, //ink's amount splashRange: 75, // set splash's range,just work on the mode "ink" splashInkSize: 10, // set splash ink'size,just work on the mode "ink" mode: "pencil", //painting mode,you can pick "pencil","crayon","ink" strokeStyle: '#000', // start stroke style bg: "#ffffff", // set bg on init onShapeDown: null, // callback for draw down event onShapeMove: null, // callback for draw move event onShapeUp: null // callback for draw up event };
Weibo:inzrb's Weibo
MIT licensed
Copyright (C) 2010-2014 Websanova inzrb's Website