如何在img hover上顯示購物車WP

-1

我的網站上有圖像懸停的想法。目前，我的網站位於本地服務器上，因此我無法共享該鏈接。但我希望解釋正確。如何在img hover上顯示購物車WP

我使用二十三個主題，woocommerce插件和我的任務是使像素完美的自定義設計。所以，我從兒童主題創建和自定義CSS開始。

我的問題是添加到購物車按鈕僅在產品圖像懸停時可見。我的購物車當前的CSS是：

form.cart { 
margin-bottom: 0; 
position: absolute; 
top: 30px; 
margin: 0 auto; 
left: 0; 
right: 0; 
} 
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { 
background-color: transparent; 
color: #fff; 
border: 1px solid #fff; 
border-radius: 0; 
font-size: 12px; 
display: none; 
}

這裏是需要的結果：

我無法修復只能在產品圖像懸停它的知名度。

我可以覆蓋所需的一切。謝謝你的幫助。

來源

2016-08-22 Oleg

可能重複[只使用CSS，顯示div懸停在]（http://stackoverflow.com/questions/5210033/using-only-css-show-div-on-hover-over- a） – billynoah

不知道你的HTML，我不能保證這會工作的結構，但這樣的：

.add-to-cart-button{ 
display: none; 
} 

.product-image:hover .add-to-cart-button{ 
display: block; 
}

如果你添加到購物車按鈕是產品形象的一個孩子或一個孩子這隻會工作產品形象的兄弟姐妹。

來源

2016-08-22 20:29:55 Pat

如何在img hover上顯示購物車WP

回答

相關問題