Question

我有跟随HTML，其中悬停增长div向下但我想向上成长。

<html>
<head>
<style type="text/css"> 

div
{
position:absolute;
top:130px;
left:30px;
width:100px;
height:100px;
background:red;
-webkit-transition:height 2s; 

}

div:hover
{
height:200px;
}
</style>
</head>
<body>


<div></div>



</body>
</html>

如何在悬停时反转过渡？

Answer 1

尝试在div上设置bottom属性，而不是top：

div
{
position:absolute;
bottom:130px;
left:30px;
width:100px;
height:100px;
background:red;
-webkit-transition:height 2s;     
}

示例：http://jsfiddle.net/lukemartin/s9jEp/

如何反转CSS3过渡？

1 个答案: