maxWidth/maxHeight on resize

[stanguy]

Implemented the use of maxWidth/maxHeight with the resize method by checking the corresponding options compared to the width/height computed.

[Gidgidonihah]

Tested this out, and it's exactly what I need. I'd love to see this in v1.3.16

[dosercz]

I vote for this fix too. This is a big problem for me, if resize doesn't work well if maxWidth/maxHeight is set.

[albell]

Yes, please!

[SimonSteinberger]

:+ This would solve a lot of responsive design issues, because one can then simply call the colorbox.resize inside the document.resize callback.

[alanjohnson]

oh yes, please.

[cbloss]

I love this idea because I'm running into it right now. I don't know if anyone else ran into it but I tried to implement the code above and my maxHeight wasn't getting set here: options.maxHeight. However, I was able to get it to work using the settings instead.

[ElectronHerder]

I had a need to make the Colorbox javascript code respect the maxWidth parameter if passed in on a resize. Made the following change, which could also be made to the height parameter.

Starting at line 738:

publicMethod.resize = function (options) {
    var scrolltop;

    if (open) {
        options = options || {};

        if (options.maxWidth) {
            if (options.width) {
                var mw = setSize(options.maxWidth, 'x');
                var ww = setSize(options.width, 'x');
                settings.w = (mw < ww ? mw : ww) - loadedWidth - interfaceWidth;
            } else {
                settings.w = setSize(options.maxWidth, 'x') - loadedWidth - interfaceWidth;
            }
        } else if (options.width) {
            settings.w = setSize(options.width, 'x') - loadedWidth - interfaceWidth;
        }

So, calling it like this, on window resize, now works like a charm for responsive / mobile sites:

$.colorbox.resize({width:"95%", maxWidth:600});