添加到购物车按钮在悬停时立即显示/消失

Question

我在Shopify上遇到特定收藏品的问题。

在这些网页上：http://www.cooldownjuice.com/collections/menu#cc和http://www.cooldownjuice.com/collections/juice-cleanses

关于产品，＆＃34;冷却清洁，＆＃34;出现悬停按钮上的添加到购物车，并在悬停时立即消失。

对于商店中的任何其他商品，这不会发生。

任何帮助将不胜感激！

Answer 1

这是因为在悬停时，您的form会向下发送165px。

.product_listing_main .product_img form {
    top: 165px;
}

这个值是绝对的，当图像较短时，它会在图像下面溢出你的div，所以它是不可见的。更改为此应始终在悬停时垂直居中按钮：

.product_listing_main .product_img form {
    top: calc(50% - 21px);
}

（21px是你按钮高度的一半）

Answer 2

如果您可以将规则添加到CSS文件，请尝试编辑此块的CSS：

.product_listing_main .product_img form {
   top: 50%;
}

或者如果你不能编辑CSS。尝试在此块中替换产品的图像。新图像的高度应至少为330像素。