var zoomTime = new Array();

function zoom(o,f,x) {
    if (zoomTime.length) {
        setTimeout(function() {
            zoom(o,f,x);
        },100);

        return 0
    }

    f = document.getElementById(f);

    if (x) {
        smaller(f,0,0,30,40);
    }
    else {
        f.style.background = 'url(' + o.getAttribute('src') + ')';

        larger(f,300,400,30,40);
    }

    return 0;
}

function zoomSet(o,w,h,l,t,d,f) {
    var x = setTimeout(function() {
            if (f) {
            }
            else {
//            o.style.left = l + 'px';
            o.style.width = w + 'px';
//            o.style.top = t + 'px';
            o.style.height = h +  'px';
            }
            zoomTime.pop;
            zoomTime.length--;
            },d);

    zoomTime.push(x);
}

function larger(o,he,we,hs,ws) {
    var t = o.offsetTop;
    var l = o.offsetLeft;
    var h = o.offsetHeight;
    var w = o.offsetWidth;

    var i = 0;
    
    while (h < he || w < we) {
        if (h < he) {
            var x = he-h > hs ? hs : he-h;

            h += x;
            t -= x;
        }

        if (w < we) {
            var  x = we-w > ws ? ws : we-w;

            w += x;
            l -= x;
        }
  
        zoomSet(o,w,h,l,t,300 + (++i * 10));
    }
}

function smaller(o,he,we,hs,ws) {
    var t = o.offsetTop;
    var l = o.offsetLeft;
    var h = o.offsetHeight;
    var w = o.offsetWidth;

    var i = 0;
    
    while (h > he || w > we) {
        if (h > he) {
            var x = h-he > hs ? hs : h-he;

            h -= x;
            t += x;
        }

        if (w > we) {
            var  x = w-we > ws ? ws : w-we;

            w -= x;
            l += x;
        }
       
        zoomSet(o,w,h,l,t,300 + (++i * 10));
    }
}