如何僅使用 css 或 css+jquery 構建懸停效果

Question

你能幫我構建懸停效果，比如在屏幕截圖上，只用 css 嗎？ 或者，使用 css+jquery。 謝謝 ] 1

Answer 1

1 使描述可見 2 定位它 3 利潤

來自工作現場的示例

css：

.m-gallery-product-item .hover-wrap {
    display: none;
    height: 0;
}


.m-gallery-product-item .item-main:hover .hover-wrap {
    display: block;
    position: relative;
    z-index: 3;
}

html：

<div class="m-gallery-product-item">
 <div class="item-main">...
  <div class="item-img">,</div>
  <div class="item-info">,</div>
  <div class="hover-wrap"> 
   <div class="hover-main">
    <div class="tags"> ,,,,,,,,, </div> 
   </div> 
  </div>
 </div>
</div>

請參閱 ebay.com alibaba.com 上的工作示例，許多大型和流行的銷售網站長期使用該標記，只需將其復制粘貼到您的代碼中即可！