targeting future size for css transition

[g-van-vreckem]

A quick bad hack Idea to keep the focus during css transition: Should the container size be affected by css transition, calling adjustFocus() in the animation frame looks like a bad idea performance wise, so instead we could call with that syntax

    $.fn.adjustFocus = function(containerW, containerH) {
        return this.each(function() {
            //Declare variables at top of scope
            var image,
            ...
        if (containerW == undefined) containerW = $(this).width();
        if (containerH == undefined) containerH = $(this).height();
        ...
            if (wR > hR) {
                image.css('width', imageW * containerH / imageH + 'px');
                image.css('height', '100%');
            } else {
                image.css('width', '100%');
                image.css('height', imageH * containerW / imageW + 'px');
            }
            ...
            image.css('transform', 'translate3d(' + hShift + 'px, ' + vShift + 'px, 0)');

Where containerW and containerH are the final size after the animation complete, The user just need to add the transition timing information on the img for left, top or translate3d in the css. Note the removal of "max-" to solve some incredible misalignment during the animation and the need to specify a value for max-width instead of '' / 'auto' if you want the animation to remain smooth. I guess the computed value could to be set back to auto at the end of the animation.