产品图片不显示（Woocommerce）

Question

我的产品图片会显示，但是当我点击进入产品页面时，图片会被隐藏，只有在我点击时才会显示。某些产品在其他浏览器上显示。有些产品仅在microsoft Edge上显示。

修改 真正的问题是cloudflare火箭加载器，阻止了网站的一些javascript。通过禁用该选项，它解决了问题。

Answer 1

有一个CSS问题，在woocommerce.css中，这个班级.product.has-default-attributes.has-children > .images有opacity:0你需要设置这个班级opacity:1贝娄是片段

.product.has-default-attributes.has-children > .images {opacity :0}

将此行更改为

.product.has-default-attributes.has-children > .images{opacity :1;}

Answer 2

在您的Css中woocommerce.css将body { background: black; } .process { background-color: rgba(255, 255, 255, 0.15); height: 255px; width: 630px; position:relative; text-align: center; } .process > img { text-align: center; display: inline-block; padding-top: 40px; padding-bottom: 33px; } .lockup { text-align: center; position:absolute; top:100px; right:0; left:0; } .lockup h2 { color: #5db442; font-size: 26px; font-weight: 100; text-transform: uppercase; margin-top:0; } .sign { display:inline-block; vertical-align:top; margin-right:30px; } .fill { display:inline-block; text-align:left; } .fill p { color: white; } 类设置为.product.has-default-attributes.has-children > .images至opacity更改或删除此类或覆盖主题css中的类

0

要

.product.has-default-attributes.has-children > .images{opacity: 0;}

图片仅在点击时显示因为点击.product.has-default-attributes.has-children > .images{opacity:1;} 课程后，使用.image

将opacity添加到1

Answer 3

在另一个支持网站上找到了这个css并为我修复了它：

.woocommerce div.product div.images.woocommerce-product-gallery 
{
opacity:100!important;
}

Answer 4

只需添加此CSS

.woocommerce-product-gallery {opacity: 1 !important;}

我真的不知道纠正此问题的最佳方法。