2

I have been able to implement colorbox into boostrap and it is working, but am having a problem getting it to be responsive. What I mean is that an image or slide show will open correctly in a colorbox modal if the page is full size, but it will not open scaled down to the screen size of the shrunken browser. It opens full size in the shrunken responsive mode causing you to have to scroll to see the image or close it. I know that it is possible to scale a carousel using:

img {max-width:100%;}

Also the bootstrap modal will scale naturally as a part of it's functionality when used or called correctly.

I'm still learning all of this and have tried tweaking a lot without success, after finding a couple of not quite similar posts around the web.

Any insight would be appreciated.

Thanks again.....

James Allardice
  • 164,175
  • 21
  • 332
  • 312
user1442988
  • 23
  • 1
  • 5

2 Answers2

3

This problem is not necessarily relative to bootstrap.

I found a similar post discussed this colorbox topic, and one of its answer points to the official colorbox site with a solution.

And I can confirm this answer works. https://stackoverflow.com/a/13105833/728675

Community
  • 1
  • 1
RayLuo
  • 17,257
  • 6
  • 88
  • 73
0

In the minified version of colorbox.js search for the sting "initialWidth:"600",innerWidth:!1,maxWidth:!1," and replace it with initialWidth:"600",innerWidth:!1,maxWidth:"100%","

In the non minified version (if you're using it) replace "maxWidth: false," with "maxWidth: 100%,"

Cristian Vultur
  • 11
  • 1