Minimum size

[jurriaan]

When opening small pictures colorbox looks really weird (overlapping icons etc.)
Is it possible to add a minimum size config option?

For sample code see (replace img with photo): http://groups.google.com/group/colorbox/browse_thread/thread/5f892ed688b2af5

[jackmoore]

ColorBox does need this option, and it's on my todo list. In the
meantime, would something like this work for you?

.cboxPhoto {min-height:700px;}

On Thu, Feb 16, 2012 at 9:06 AM, Jurriaan Pruis
reply@reply.github.com
wrote:

When opening small pictures colorbox looks really weird (overlapping icons etc.)
Is it possible to add a minimum size config option?

For sample code see (replace img with photo): http://groups.google.com/group/colorbox/browse_thread/thread/5f892ed688b2af5

---

Reply to this email directly or view it on GitHub:
#159

Jack Moore
jacklmoore.com
twitter.com/jacklmoore

[jurriaan]

I used the fix mentioned in http://groups.google.com/group/colorbox/browse_thread/thread/5f892ed688b2af5
Works perfectly :)

[danrowlands]

I'm currently trying to achieve the same thing: have a minimum height and width in situations where the image I'm displaying is very small. Unfortunately the google groups url doesn't seem to exist and the .cboxPhoto {min-height:700px;} doesn't work for me either.

Are there any other suggestions on how I can do this?

[kiwi3685]

Anyone found a solution to this yet?

jackmoore - any chance it might appear in next version?

.cboxPhoto {min-height:700px;} doesn't do it.

[mike-s-]

Sorry to dig up an old issue issue but any chance you will be adding this functionality?

[thanosk]

The following patch I'm pasting is what that google groups thread contained for this issue (kudos to the original patch author who I do not recall his name). I've been using it for years and slightly adapted it for 1.5.x and 1.6.x compatibility (mainly settings.get()).

jackmoore, if you think this patch is not sloppy or dirty or anything, let us know if you would accept it as a Pull Request so I (or someone else) can prepare it and send it over to you.

--- jquery.colorbox.js.orig 2015-05-07 13:43:27.328642831 +0300
+++ jquery.colorbox.js  2015-05-07 13:45:52.392729499 +0300
@@ -22,10 +22,12 @@
        initialWidth: "600",
        innerWidth: false,
        maxWidth: false,
+       minWidth: false,
        height: false,
        initialHeight: "450",
        innerHeight: false,
        maxHeight: false,
+       minHeight: false,
        scalePhotos: true,
        scrolling: true,
        opacity: 0.9,
@@ -788,11 +790,17 @@

        function getWidth() {
            settings.w = settings.w || $loaded.width();
+           if (settings.get('minWidth') && settings.w < settings.get('minWidth')) {
+               settings.w = setSize(settings.get('minWidth'), 'x');
+           }
            settings.w = settings.mw && settings.mw < settings.w ? settings.mw : settings.w;
            return settings.w;
        }
        function getHeight() {
            settings.h = settings.h || $loaded.height();
+           if (settings.get('minHeight') && settings.h < settings.get('minHeight')) {
+               settings.h = setSize(settings.get('minHeight'), 'y');
+           }
            settings.h = settings.mh && settings.mh < settings.h ? settings.mh : settings.h;
            return settings.h;
        }
@@ -1007,8 +1015,8 @@
                        }
                    }

-                   if (settings.h) {
-                       photo.style.marginTop = Math.max(settings.mh - photo.height, 0) / 2 + 'px';
+                   if (settings.h || settings.get('minHeight')) {
+                       photo.style.marginTop = Math.max((settings.h || settings.get('minHeight')) - photo.height, 0) / 2 + 'px';
                    }

                    if ($related[1] && (settings.get('loop') || $related[index + 1])) {

[adam-jones-net]

Another vote for this to be added please!

[arnisjuraga]

+1

[jaypan]

The additions provided by Thanosk work for me as well. Please add them to the script.

[ivantcholakov]

+1
I backported the patch by thanosk within ColorBox 1.4.4, it works for me.

[jdorenbush]

+1

[ghost]

+1

[e10a]

+1

[virenbpanchal]

I am using jQuery colorbox Version 1.6.4.
I have used this solution .cboxPhoto {min-height:700px;} and colorbox opened with minimum height of 700px. But the image inside it becomes distorted (my image height is 63px but it stretched out to 700px height.)
So for me below solution worked.
innerHeight: 700 => colorbox opens with 700px height. And my image which is 63px, appears vertically middle in colorbox.

[gbthakkar]

Anyone found a solution to this yet?

jackmoore - any chance it might appear in next version?

.cboxPhoto {min-height:700px;} doesn't do it.

it works for me ... Thanks