首页 新闻 搜索 专区 学院

jQuery文字过渡效果

0
[已解决问题] 解决于 2020-10-05 08:35

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="../JavaScript/jquery_min.js"></script>
</head>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.login{
background-color: #f3f3f3;
padding: 0;
text-align: center;
padding-top: 15px;
height: 50px;
}
.login li{
display: inline;
list-style: none;
margin: 0 auto;
}
.login li a{
padding: 0px 20px 0px 20px;
text-decoration: none;
font-size: 20px;
color: #cccccc;
}
.active{
color: red;
transition-duration: 1s;
}
</style>
<body>
<herder>
<div class="posion">
<ul class="login">
<p><a href="javascript:;">首页</a></p>
<p><a href="javascript:;">交友</a></p>
<p><a href="javascript:;">情侣商店</a></p>
<p><a href="javascript:;">社区</a></p>
<p><a href="javascript:;">我的个人中心</a></p>
</ul>
</div>
</herder>
<script type="text/javascript">
$(document).ready(function(){
$("li").hover(
function () {
$(this).children().addClass('active')
},
function () {
$(this).children().removeClass().css('color','');
}
);
})
</script>
</body>
</html>

为什么我这个写了文字没有过渡的效果呀

小白萝卜呀的主页 小白萝卜呀 | 初学一级 | 园豆:3
提问于:2020-09-05 19:47
< >
分享
最佳答案
1

因为你没有指定 transition-property

奖励园豆:5
by.Genesis | 小虾三级 |园豆:1937 | 2020-09-06 09:44
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册