Thumbnails Overlay Map on Mobile Devices

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

Open Support Ticket

Tagged: archive page, map, mobile

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