jq(document).ready(function(){
	// get img width 
	var oWidth = jq('img.resize').width();

	// get img height 
	var oHeight = jq('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)*2;
	
	jq('img.resize').hover(function(){
		//stops the event from happening in case of an abrupt mouseOut
		jq(this).stop();

		//custom animation effect to change the width and height of the img
		jq(this).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(){
                 //stops the event from happening in case of an abrupt mouseOut
                jq(this).stop();
		
                //this animation shrinks the image back to original size
                jq(this).animate({
                     width: oWidth +'px',
                     height: oHeight +'px'
                },1000);

  });

});