Question

I’m trying to resize the container and set for it width and height. It is not all the part of code, but infinity loop appears then i call
$.fn.imageScale.resizeContainer function, I can’t find why?

$( window ).load(function(){    
    $( '#scalable_images' ).imageScale();
});

(function($){
$.fn.imageScale = function(){

    thisCallback = $( this ); // for usage in inner other function
    images = $( this ).find( 'img' ); // images
    imagesHolder = $( this ).find( '.item' ); // image holder
    frameSize = 34; // frame size
    sizingCof = 1.5; // image size cofficient to scale, 1.5 = 150% normal state
    speed = 600; // speed in ms

    $.fn.imageScale.resizeContainer();
    $.fn.imageScale.resize();
    OldContainerW = imagesHolder.width();
    OldOffsetL = offsetL;

    $( window ).bind( 'resize', function(){
        $.fn.imageScale.resizeContainer();
        $.fn.imageScale.resize();
        OldContainerW = imagesHolder.width();
        OldOffsetL = offsetL;
    });
}

$.fn.imageScale.resizeContainer = function(){

    var windowW = $( window ).width();
    var windowH = $( window ).height();
    var scaleImgH = windowH - frameSize * 2;
    var scaleImgW = windowW - frameSize * 2;

    $( this ).height( scaleImgH );
    $( this ).width( scaleImgW );
}
})(jQuery);

Answer 1

Because you bind the resizeContainer function to the resize event, and in the resizeContainer function you resize the container, triggering the resize event again, which executes resizeContainer again, ad infinitum