Hi Beee,
This the famous GoogleMap bug π
The problem is that the height is not known when the map is created (100% is not a size, you have to set a number of px)
check out the implementation of this plugin http://wordpress.org/extend/plugins/fi-events-manager-addons
Thread Starter
Beee
(@beee)
I set the size in pixels in the settings (just now) and I uploaded map-global.php but that doesn’t seem to take any effect.
Thread Starter
Beee
(@beee)
I uploaded map-global.php to my theme directory but also to the plugin directory. I keep getting 100% defined even though it’s removed from the template.
Annoying is it not ?
There is another catch: GoogleMap does not initialize maps properly in a hidden container.
So what you want is this:
– Your .verberg div containing the .em-location-map-container should not be hidden but with a height:0px
– Your .em-location-map-container should have a overflow:hidden and an absolute height (has you did with 300px)
– When .toon is clicked you have to animate the .verberg div to change height from 0px to 300px
Thread Starter
Beee
(@beee)
A bit yes, this plugin always works nice, but this is the first time (that I know of) something is not working as it should (as in the theme override).
I will try to work in those heights tonight and then I’ll check by disabling all plugins (which use jquery) to see if that helps a bit…
Please don’t blame this plugin (or other plugins or themes) π
It is really a GoogleMap issue …
Just google ‘google map jquery hide show’ to see how many people are struggling with it
Cheers
thanks @franceimage π
@beee, can you share with us a sample link for us to see?
Thread Starter
Beee
(@beee)
I’m not blaming this plugin for this error, but it seems the template map-global.php doesn’t get read if I overwrite it in my theme directory.
Or I’m wrong in assuming that map-global.php is used when #_eventmap is used.
@ angelo see my first message
I see, I didn’t noticed the Click here for map; sorry about that
however, could it be because of your toggle function on map? what happens when the map loads instantly or normally without clicking on “Click here for map”?
other useful links:
http://wp-events-plugin.com/documentation/faq/
http://wp-events-plugin.com/tutorials/modifying-event-location-google-maps/
Thread Starter
Beee
(@beee)
I don’t see where verberg is hidden.
I added the codes to my css but unfortunately it’s not working yet.
<!-- script voor uitklappers -->
<script type="text/javascript" src="http://www.freerides.org/wp-content/themes/v0.2/js/general.js"></script>
There is a jQuery(“.verberg”).hide(); in it
Thread Starter
Beee
(@beee)
AAAHHH I thought you meant css wise…
I will make some changes… to be continued… π
Thread Starter
Beee
(@beee)
Hiding jQuery(“.verberg”).hide(); did the trick in positioning it properly but now it shows immediately upon load.
Thread Starter
Beee
(@beee)
Can NE1 tell me if I’m correct to assume that map-global.php should overwrite the showing of the map in this situation ?
edit: just found out, I have to use locationmap.php instead of map-global.php.
So going into the retry with an edited template now…
re-edit: just tried it and changes take effect (as in code changes), but map is still expanded upon load and collapses on click.
Isn’t there a simple way to reverse it ? Fold on load, expand on click ?
Thread Starter
Beee
(@beee)
I’ve managed to not show the map upon load with the .verberg { height: 0; } but what css to use to define it when clicked/open because now I can’t open it anymore.
I tried
.open .verberg { height:325px; }
and
.active .verberg { height:325px; }
but I’m no star in jquery (this script was taken from the univeristy’s website I work at, but they don’t use it for maps but for text only).