$(document).ready(function(){

			// get img width
	var oWidth = $('img.resize').width();

	// get img height
	var oHeight = $('img.resize').height();

	//You could always multiply the multiplier if you want to make the image adjust to a larger size.  Keep in mind though it will get more blurry
	var mpx = (oWidth / oHeight);

	 $('img.resize').hover(function(){
			  $(this)

				//stops the event from happening in case of an abrupt mouseOut
				.stop()

				//custom animation effect to change the width and height of the img
				.animate({

					//take the original width/height X multipler and tag on the 'px'
					width: (oWidth * mpx) +'px',
					height: (oHeight * mpx) +'px'

					//space the animation out over 1 sec (deals in milliseconds)
				},1000);
	  },
	  //this is just like a mouseOut effect to take the img back to the original size
	  function(){
				$(this)

					 //stops the event from happening in case of an abrupt mouseOut
					.stop()

					//this animation shrinks the image back to original size
					.animate({
						 width: oWidth +'px',
						 height: oHeight +'px'
					},1000);

	  });

	});