How do I set up a link to use width and height percentages instead of the default pixel unit? I tried it with numbers followed by a percent sign but it didn't work at all. In this day and age of responsive design I find it hard to believe I haven't been able to find a solution.

<a class="colorbox-load" href="@terms?width=500&height=500&iframe=true">Terms & Conditions</a>

Comments

Status:Active» Closed (fixed)

Nevermind, I figured out how to get pretty much what I want by setting the max width/height in the Colorbox module settings and then setting the link to a larger size to fill it minus the negative of the max width/height.

Status:Closed (fixed)» Active

This is a nice workaround and I will use it for the time being but ... it is no final solution.

I have searched about 1 day to find the reason why this doesn't work. I expected that this would work:

Terms & Conditions

but it didn't.

At least I expected that the settings would kick in (Max width = 80%, Max height = 100%, Initial width = 80% and Initial height = 100%)

But they didn't either except when you use it as described by deanflory.

I'm willing to sponsor the correct solution.
Thanks in advance

Any solution for that please?

While what I stated previously is not a direct fix as it should accept a percentage ("40%", though that symbol may cause problems and might be the reason why it's not available, dunno), it does actually work for getting a percentage, just only for one setting across the entire site.

  1. Go to: /admin/config/media/colorbox
  2. Scroll down to "Max width" and "Max height".
  3. Set those as you wish for your percentage: example: "92%"
  4. Then on your link set it to something high that will more than fill the size of most browser window sizes, which will be automatically adjusted by the "Max width/height" setting, making it the percentage width you wanted.
    <a class="colorbox-load" href="@terms?width=1200&height=1200&iframe=true">Terms & Conditions</a>

I found another solution for that
use: width=90%20&height=90%20

if you want it to be 90% X 90% (you need to add 20 after the %)

Just off the top of my head, but isn't percentsign20 the equivalent of a space? I say this out of seeing URLs for files with spaces in the name and they're converted to the equivalent. I may be wrong. If I'm right, your solution tassaf may not be doing what you think. I haven't tested it yet, would be good if it did work.

FYI, when trying to submit this comment without the code wrapper that's on it now, I got "Validation error, please try again. If this error persists, please contact the site administrator.", so percentsign20 messes with things, that or Drupal was making some changes on the site while I was submitting.

I am sorry.. I wrote %20 by mistake

Please use %25 which is the % but encoded

is it possible to define minwidth and minheight?

@Razia_b

You can set that in the colorbox configuration /admin/config/media/colorbox