jq 鼠标指向隐藏显示区域

html

<ul>

<li>

<a href="#" id="product"><img src="img/资源-1.png" alt=""></a>

<a href="#" class="sub" id="sub">

<span class="look">查看详情</span>

<span class="line"></span>

<span class="xj">立即询价</span>

</a>

<span class="title1">盐酸左旋西替利泰（这是名）</span>

<span class="price1">￥14</span>

</li>

 

</ul>

css

.sub{

position: absolute;

bottom: 67px;

width: 230px;

height: 38px;

background: rgba(255, 54,54, 0.7);

display: block;

display: none;

}

 

jq

 

$("ul li").hover(function(){

$(this).find(".sub").show()},

function(){

$(this).find(".sub").hide();

})