40% OFF EVERYTHING
BLACK FRIDAY SALE
Buy Now

z-index of full screen map

This topic contains 4 replies, has 3 voices, and was last updated by  Paolo 10 years, 4 months ago.

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket
  • Author
    Posts
  • July 22, 2014 at 9:21 pm #9485

    vertuscraig
    Lifetime Member
    Post count: 44

    Hi,

    I’m wondering is it possible to adjust the z-index of the map when it is full screen (see screenshot).

    Problem I have is my nav bar is being display on top of the map when full screen, if I adjust the z-index of my nav bar, the bottom of the sub-menus are cut of at the top of the normal map.

    The website is at http://myhappykids.vertusdigital.co.uk/ if you want to take a look.

    I can see this being a common problem for people using large sub-menus / mega-menu, if there isn’t already a way to increase the z-index of the map when full screen, it would be a welcome addition.

    Cheers, Craig

    July 22, 2014 at 10:28 pm #9496

    Guust
    Moderator
    Post count: 29970

    Simplest would be to increase the z-index of your menu, like you have done.
    Otherwise I think you could add
    .map_background {z-index: whatever}
    but the map CSS itself is controlled by Google I think. That does not mean you cannot adjust the CSS, but it might not be the best idea.
    Happy to be corrected on my reply …

    July 22, 2014 at 10:33 pm #9497

    vertuscraig
    Lifetime Member
    Post count: 44

    Hi,

    I’ve fixed the issue I was having by adding the following line of code to map.js around line 67:

    jQuery('#' + map_canvas +'_triggermap').closest('.geodir_map_container').toggleClass('geodir_map_container_fullscreen');

    Then added a new css rule for the new class – .geodir_map_container_fullscreen that increases the z-index when the map is full screen.

    Any chance you could add it in the next version, or is there a way I can add the code to my functions.php in my child theme so it doesn’t get overwritten with every update.

    Cheers, Craig

    July 22, 2014 at 10:39 pm #9498

    vertuscraig
    Lifetime Member
    Post count: 44

    Hi Guust,

    Just noticed you reply after adding the comment above.

    I’d tried doing it with css, problem I had was my nav’s sub-menus overlap the map when it is normal size, so when I change the z-index of my menu the map is on top / overlapping the sub-menu when the map is normal size.

    If I move the z-index the other way, the nav shows when the map is full screen.

    The method above seems the easiest way, as it adds a new class to the map when it is full screen.

    Cheers, Craig

    July 23, 2014 at 9:04 pm #9677

    Paolo
    Site Admin
    Post count: 31206

    thanks for the update Craig! I’ll makr this as solved and pass your suggested fix to the developers.

    Thx

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket
20% Discount Offer
Hurry! Get your 20% discount before it expires. Get 20% Discount