When I use a colorbox-trigger to open a colorbox, I have to specify the width and height of the overlay - unlike in a regular colorbox image field, where it adapts nicely to the screen size. Is there any way to get such a feature in views?
6
-
1Just make the height and width larger than the normal screen, colorbox reduces its size automatically to fit the screen.– PaulOct 6, 2014 at 6:53
-
@Paul : unfortunately it doesn't, it cuts the image to the given size instead of making it fit the screen (scaling it)– DalmazOct 6, 2014 at 11:18
-
1Is it ONLY an image you want to display?– PaulOct 6, 2014 at 11:21
-
No, i actually try to put custom caption that would be more extensive then what tokens let me do - with some HTML and linked content.– DalmazOct 6, 2014 at 11:22
-
Actually Views is my second attempt - I tried to theme the caption and insert some HTML into the tokens there, see drupal.stackexchange.com/questions/131719/…– DalmazOct 6, 2014 at 11:24
|
Show 1 more comment
1 Answer
The colorbox-trigger is normally only required when you want to display HTML in your colorbox. You are then required to set height and width as colorbox is not able to determine the dimensions of the HTML content before it is loaded.
If you want to display an image in a colorbox, there's no need to use the colorbox-trigger but instead just add the image field and use colorbox as image style. Within the field formatter settings of colorbox you can then define the image styles to be used for preview and inside the colorbox. If the colorbox image style exceeds the screen, colorbox will automatically resize the image to fit the screen/window.
In your case, you want to have the image displayed along with custom HTML captions. Thus, you need to define the colorbox content and then set height and width to 100%. The colorbox will then use up maximum available space. However, your image is still not diplayed at 100% width. To achieve that, you would need a quite large image to be displayed in the colorbox, eventually add a wrapper div to it and set a CSS rule like
div.wrapper img { max-width: 100%; }
-
The thing is that when I use the colorbox formattter in views, I cannot use any tokens that appeal to the other fields in views - the tokens are very limited for the caption fields. if I use colorbox-trigger, in the other hand, I need to specify width and hieght– DalmazOct 6, 2014 at 12:52
-
well, I added
#cboxLoadedContent img {max-width: 100%;max-height:100%; width: auto !important; height: auto !important;}and it seems to work ;-). Thank you @Paul !– DalmazOct 6, 2014 at 13:05