I added a Colorbox trigger field to a Views display. And want to show a Gmap field (using replacement pattern) within the Colorbox trigger field.
When clicking Views field: Colorbox trigger link the Colorbox lightbox opens, all fields and contents show correct and accordingly my css, but the Gmap (Google map) doesn't. The map is expected to load with width 400px but the map image shows only 100px width and the rest is having grey background.
So my question is.. Can I solve this by using css-trick? Anyone else that succeed to load a Gmap (Google map) in Colorbox using Views Colorbox trigger field?
Comments
Comment #1
miccelito CreditAttribution: miccelito commentedThe colorbox trigger link looks something like this..
I guess it would be better if the '
<div style="display: none;">
' tag could be assigned class'hide' or 'active' depending on if colorbox is open or closed. In that way it would be possible to add 'display:block;position:absolute;left:-10000px;top:-10000px;' or whatever else to the div when it's assigned class hide. Having the mentioned div tag styled display:none in general is probably causing that a Google Map will have problem to show correctly without grey background issue.Just a thought..
Edit:
It seems that there's no need of assigning extra classes (as mentioned above). You can simply add to your css:
That will solve the Gmap centering issue.
Howsoever, a suggestion to maintainer:
colorbox/views/colorbox_handler_field_colorbox.inc line 196
return $link_tag . '<div style="display: none;"><div id="colorbox-inline-' . $i . '">' . $popup . '</div></div>';
change to
return $link_tag . '<div class="colorbox-hide" style="display: none;"><div class="colorbox-inline" id="colorbox-inline-' . $i . '">' . $popup . '</div></div>';
Then it would be easier to add the css
Thanks for a great module! Colorbox seems to work much better than Lightbox2 module in many ways, especially when including/adding dynamic popup content that is depending on jquery/scripts.
Comment #2
Neslee Canil Pinto