Thumbnails Overlay Map on Mobile Devices

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

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

Open Support Ticket

Tagged: , ,

  • Author
    Posts
  • December 12, 2019 at 2:29 am #521067

    identity
    Lifetime Member
    Post count: 445

    Is this a bug or expected behavior?

    Upon viewing the archive page on a mobile device and then selecting “Show Map” it pulls the map up but also still have the thumbnail images partially overlaying the map, making it challenging to interact with either.

    That’s actually not necessarily the worst, in portrait mode, because if you are in landscape mode, I can’t even scroll the screen (obviously may depend on the device and screen size).
    See attached.

    Cheers

    December 12, 2019 at 10:00 am #521110

    Alex Rollin
    Moderator
    Post count: 27815

    That is probably a z-index CSS issue, please share a link to the page and we can take a look. Once the images are ‘under’ the map should be ok.

    December 12, 2019 at 3:08 pm #521174

    identity
    Lifetime Member
    Post count: 445
    This reply has been marked as private.
    December 13, 2019 at 3:54 pm #521368

    Naveen Giri
    Moderator
    Post count: 1559

    Hi identity,

    Please use following css meanwhile I will check it with other themes and if needed. I will add patch for it in plugin.

    
.geodir-image-container ul.geodir-images li.geodir-active-slide{
	z-index: 1 !important;
}

    Thanks

    December 13, 2019 at 4:58 pm #521377

    identity
    Lifetime Member
    Post count: 445

    That seemed to do the trick!

    Cheers

    December 14, 2019 at 8:29 pm #521556

    identity
    Lifetime Member
    Post count: 445

    Naveen,

    Not sure if this resulted from some changes I made or the recent update, but I noticed today that the map overlay was an issue again.

    I since modified the CSS to:

    .geodir-image-container ul.geodir-images li {
	z-index: 1 !important;
}

    If this was due to my edits, it may be important to identify a universal solution to this issue.

    Cheers

    December 16, 2019 at 9:52 am #521661

    Naveen Giri
    Moderator
    Post count: 1559

    Hi identity,

    can you share the link where you face the issue again. because for last url it seems good.

    Thanks

    December 16, 2019 at 2:23 pm #521724

    identity
    Lifetime Member
    Post count: 445

    Sorry, let me clarify…

    Based on my edit to your previous CSS, the “li” element from this

    li.geodir-active-slide

    to just this

    li

    It is ok now.

    What I was calling out was that I wasn’t sure if it stopped working because of an update or changes I made, but that any solution might need to be robust enough to address variations.

    Cheers

    December 18, 2019 at 11:51 am #522163

    Naveen Giri
    Moderator
    Post count: 1559

    I see, we only have z-index:2 for the active slide element that creating the issue.

    So we don’t need the above css for all li. just li.geodir-active-slide will work.

    I have pushed css in plugin. so you will not need this additional css in future.

    Thanks

    December 18, 2019 at 5:21 pm #522221

    identity
    Lifetime Member
    Post count: 445

    Excellent, thanks!

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

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

Open Support Ticket