DMXzone Google Maps Support Product Page


Only part of map showing in browsers

Reported 30 Oct 2012 11:46:45
has this problem
30 Oct 2012 11:46:45 Carlos Zaragoza posted:
Where you able to check the issue I am having with Google maps?
Because I did exactly what you advised in the post that I reply to wich is about part of map showing in browsers I tried and still not working


Replied 30 Oct 2012 11:57:11
30 Oct 2012 11:57:11 Vulcho Vulev replied:
Hello Carlos.

Can you provide me with link to your page please?

Replied 30 Oct 2012 13:00:57
30 Oct 2012 13:00:57 Carlos Zaragoza replied:

Go to the tab named "How to find us"
Replied 01 Nov 2012 00:03:17
01 Nov 2012 00:03:17 Carlos Zaragoza replied:
Any answers?
Have you been able to find a way to fix this?
Replied 01 Nov 2012 07:44:09
01 Nov 2012 07:44:09 Vulcho Vulev replied:
Hello Carlos.

This is issue with the API of Google when is placed in tabs.

You can fix that with aditional custom CSS code:
.ui-tabs .ui-tabs-hide {
    position: absolute !important;
    left: -10000px !important;
    display:block !important;

There is no problem when Google maps is used within DMXZone Tabs where we overcome the issue that comes from Google by constructing the function above in behavior for redrawing.
Here is link to the product:
Dmxzone Tabs

Replied 01 Nov 2012 12:12:25
01 Nov 2012 12:12:25 Carlos Zaragoza replied:
I am using Dreamweaver tabs so where exactly I supposed to add this line of CSS, also in the email that you sent me there is the following jQuery that it does not appear on this post could you please tell me where I supposed to add this also?
$('#example').bind('tabsshow', function(event, ui) { if ( == "map-tab" { resizeMap(); } })

In other words could you tell me step by step how to do it?

Thanks for your help,

I also want to buy the Ajax AutoComplete add-on but I want to make shure that this is going to work first
Replied 02 Nov 2012 07:30:33
02 Nov 2012 07:30:33 Vulcho Vulev replied:
Hello Carlos.

Just found that you are using spry tabs. Unfortunately there is no way to fix that issue in spry tabs.

You can use the Dmxzone Tabs instead where the content of the map will display properly.

Replied 03 Nov 2012 00:08:14
03 Nov 2012 00:08:14 Carlos Zaragoza replied:
Ok, I went ahead and bought the Dmxzone Tabs now my question is: can I set the Dmxzone Tabs vertically the same way as I have them now with Dreamweaver spry tabs? if so which part of the css file I need to edit?

I need a quick response so I can get on with my work.

Best regards,
Replied 05 Nov 2012 06:27:14
05 Nov 2012 06:27:14 Carlos Zaragoza replied:
I added the Dmxzone Tabs to my webpage and added Google Maps to one of the tabs and I am still having the same problem if you know how to fix this problem tell me step by step to see if we can resolve this issue.

I also went ahead and bought the following extensions and add-ons that I am planning to use along with the Google maps extension; the Ajax AutoComplete, the Google Maps Directions Add-on, the DMXzone Tabs, and the DMXzone Accordion. But if we don't get the Google maps issue resolved I won't be able to use them and I will have to ask for a refund
Here's the link so you can check the problem.

Hope you can help me.
Replied 05 Nov 2012 08:20:25
05 Nov 2012 08:20:25 Vulcho Vulev replied:
Hello Carlos.

when you select the Dmxzone tabs in DW the user interface of the extension appear. After that markup the tab which contains the map. click on the blue clip which will open the behaviors.
>After doing that, markup When tab is shown
> When you done that in left open the folder called DMXZone and select:
> Control Dmxzone maps
> click on add behavior (the blue triangle)
> from the dropdown menu which appear called "action": >select "Redraw map instantly"
> Click ok.
> After that click Ok once again
> The behavior will apply on the tabs. Save and upload the page.

Replied 05 Nov 2012 13:59:26
05 Nov 2012 13:59:26 Carlos Zaragoza replied:
Did not work! any other suggestions?

You can check it again?
Replied 06 Nov 2012 05:16:43
06 Nov 2012 05:16:43 Carlos Zaragoza replied:
I added the css code that you told me and now it seems to be working fine.

This is the css code that I added:

.ui-tabs .ui-tabs-hide {
position: absolute !important;
left: -10000px !important;
display:block !important;

Hope that it stays like that!

Thanks for all your support.
Replied 07 Nov 2012 16:08:14
07 Nov 2012 16:08:14 Vulcho Vulev replied:
Hello Carlos.

I can confirm that everything is working correct currently cross-browser.

Replied 07 Nov 2012 23:39:18
07 Nov 2012 23:39:18 Carlos Zaragoza replied:
Yes Vulcho thanks to you everything is working great!

Again thanks for all your support!

Best regards,

Carlos Zaragoza

Reply to this topic