By default the colorbox appears centered both vertically and horizontally on the screen. Is there a way to change that, for example to 10% from top vertically and centered horizontally?

Comments

enrikito’s picture

enrikito commented

¿?

hutch’s picture

hutch commented

In the documentation for colorbox on colorpowered.com you will see that there are 4 settings, top, bottom, left and right which can be used to override the default placement. However the colorbox module does not as it stands support these settings. What you can do is write your own javascript using jQuery that does use these settings and add it to your theme.

enrikito’s picture

enrikito commented

thanks

julien.reulos’s picture

julien.reulos commented
Status: Active » Closed (fixed)

Just for the record, I confirm that colorbox repositionning is possible adding this piece of jQuery code in your own module:

$('a#some-id').colorbox({top:50, left:50});

Just change "some-id" for your own link ID, and adjust top and left values to your needs. Top, left, bottom, right properties are available.

Alternatively, you can pass the position parameters directly in the URL, like this:

<a class="colorbox-load" href="http://player.vimeo.com/video/30403047?width=300&amp;height=150&amp;top=40&amp;right=20&amp;iframe=true">link</a>