Slideshow blocks navigation dropdown menu

Technical Q&A
, , ,
1

hi everyone

I have added below code to slideshow.liquid to make the slideshow image clickable, as per hhttps://community.shopify.com/post/1612021

and another section

{

“type”: “url”,

“id”: “image_link”,

“label”: “Image Link”

},

Now I have discovered an issue. The slideshow image is blocking the dropdown list menu to be clicked.

When I click on any of the list items (in red) which is in the display area of the banner, I actually clicked on the banner.

Can anyone enlighten me?

111.png
111.png1931×1227 273 KB

2

Hi Exprt_dev

Thanks for your help. Please visit https://www.caffemolinari.com.au<>

3

Hi @haoli1

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.css / based.css file and paste the code in the bottom of the file.
.header__submenu .header__menu-item {
    z-index: 1111111 !important;
}

If my reply is helpful, kindly click like and mark it as an accepted solution.
If you are happy with my help, you can help me buy a COFFEE
Thanks!

4

Hi @haoli1 ,

Go to Online Store > Themes > Actions > Edit Code > base.css
Add below code in base.css file

.header__submenu.list-menu {
    z-index: 999999;
}
.slideshow__slide.grid__item {
    z-index: 2;
}

oscprofessional_0-1735799243357.png
oscprofessional_0-1735799243357.png1482×548 298 KB

5

Thank you so much. Your code works on my store perfectly.

6

Hi Websensepro,

thanks for providing your code. It didn’t work on my theme unfortunately.

7

thanks Exprt_dev, thanks for your detailed explanation. However, I decided to use a simple code from below.