Is it possible to make the iFrame of a Colorbox adaptive?

Question

I made an adaptive theme with Drupal 7.22, which works very fine. Unfortunately the size of the iFrame's opened by Colorbox are not adaptive.

To open them, I do the following:

<a class="colorbox" href ="http://mydomain.tld?width=800&height=700&iframe=true">Link</a>

But the width and height properties are hard-coded. How can I specify different values for the width and height properties based on the browser aperture/screen definitions?

For example, all screens which have a width between 0 and 1024px should have a colorbox iFrame with the following properties:

width=800px
height700px

and all screens which have a resolution greater than 1024px should have a colorbox iFrame with the following properties:

width=500px
height400px

Do you have any suggestion on how to make these adaptive?

Answer 1

Take a look at jRespond:

https://github.com/ten1seven/jRespond

that might be the easiest way to accomplish what you are looking for.