一个手风琴css3效果，如何做到只有移到第二格才有图2效果，鼠标移在13格还是图一的效果

html-css015

一个手风琴css3效果，如何做到只有移到第二格才有图2效果，鼠标移在13格还是图一的效果,第1张

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title></title>

<style>

*{

margin: 0

padding: 0

}

ul li{

display: block

list-style-type: none

width: 500px

height: 60px

}

#li1,#li3{

background: #09C703

}

#li2{

background: #3eebff

-webkit-transition: height .3s linear

-moz-transition: height .3s linear

-o-transition: height .3s linear

transition: height .3s linear

}

#li2:hover{

height: 300px

}

</style>

</head>

<body>

<div>

<ul>

<li id="li1"> </li>

<li id="li2"> </li>

<li id="li3"> </li>

</ul>

</div>

</body>

</html>

望采纳

鼠标滑动事件

<script type="text/javascript">

$(function(){

$("#nav-mark-btn").hover(function(){

$("#mark-info").show()

},function(){

$("#mark-info").hide()

})

})

</script>