canvas替换image插件

/*
* jQuery.imgToCanvas v0.1
* Replace a image by a canvas.
* 
*
* Usage:
* 	$('#myImage').imgToCanvas(); 
	var $canvas=document.getElementById("myImage"); 
	var $ctx=$canvas.getContext("2d");

* Author:
* Jiaqi Zhu
*/

(function( $ ){
	var methods = {
		init : function( options ) {
			return this.each(function(){
				var $this = $(this),
					data = $this.data('imgToCanvas');

				if ( !data ) {
					var width = $this.width(),
						height = $this.height(),
						pos = $this.offset(),
						$canvas = $("<canvas/>"),
						canvas = $canvas.get(0),
						ctx = canvas.getContext("2d");

					// replace target with canvas
					$this.after( $canvas );
					canvas.id = this.id;
					canvas.className = this.className;
					canvas.width = width;
					canvas.height = height;
					ctx.drawImage( this, 0, 0, width, height );
					$this.remove();

				}
			});
		},


	};

	$.fn.imgToCanvas = function( method ) {
		if ( methods[method] ) {
			return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			return methods.init.apply( this, arguments );
		} else {
			$.error( 'Method ' +  method + ' does not yet exist on jQuery.imgToCanvas' );
		}
	};
})( jQuery );