imgのホバーでカートを表示する方法WP

Question

私のウェブサイトでイメージホバーのアイデアに問題があります。現在、私のウェブサイトはローカルサーバー上にあるので、リンクを共有することはできません。しかし、私は正しいことを説明することを望む。

私は20のテーマ、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; 
} 

が必要な結果です。

必要なものをすべて上書きできます。ご協力ありがとうございます。

Answer 1

あなたのHTMLの構造を知らなくても、私はこれが動作を保証することはできませんが、のようなもの：カートボタンへのアドインは、商品画像やの子の子である場合

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

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

これはのみ動作します製品イメージの兄弟。