//<!-- accordion demo from http://justinfarmer.com/?p=14-->


jQuery().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);

  });

});