rbpape

Forum Replies Created

Viewing 1 replies (of 1 total)

  • I know you said you aren’t a developer, but if you can understand a little CSS, the problem is fixable. If you open up your site in FireFox, go to the generic FireFox menu, click “Developer,” and then click “Inspector,” you’ll see the HTML of each element you hover over with your mouse.

    Hover over your entire menu (not just your submenu) and look for the class and/or id (selectors) of your menu. That’s the first element you want to select in CSS (add some styling to). The second is main image for products that YITH is zooming in on. Give each of these elements a z-index in CSS.

    Generally speaking, z-index determines the stacking order of elements. Open up your child theme styling sheet in WordPress admin and give your menu a z-index higher than the product image, say “z-index: 1000;”. Now give your product image a z-index lower than that of your menu, say “z-index: 0;”. All in all, it’ll look something like this:

    /* your menu */
your_menu_selectors_here {
  z-index: 1000;
}

/* main product image wrapper */
.woocommerce #content .product .images .yith_magnifier_zoom_wrap {
  z-index: 0;
}
Viewing 1 replies (of 1 total)