我对jQuery有些新手,我对我想要实现的东西有疑问。
我有一个垂直导航菜单,其中每个链接都会在悬停时通过更改颜色,增加字母间距以及在左侧添加边框来设置动画。
除了点击链接时,一切都按照我想要的方式工作。单击链接后,即使我将鼠标悬停在链接上,文本也会更改为不同的颜色并保持相同的颜色。
即使我点击链接后,我也希望将鼠标悬停的颜色保持不变。 我确信我错过了一些简单的东西,但我已经尝试了所有我知道的事情,没有运气。 任何建议都会有所帮助!
以下是我对动画的看法......
<script type="text/javascript">
$(document).ready(function(){
$("ul.navlist li a").hover(function(){
$(this).stop()
.animate({paddingLeft: '10px',letterSpacing: '2px',borderWidth:'20px'},
{queue:false,easing:'easeInQuad'},50)
},
function(){
$(this).stop()
.animate({paddingLeft: '0px', letterSpacing: '0px',borderWidth:'0px'},
{queue:false,easing:'easeOutQuad'},50)
});
});
</script>
我的导航列表的css就在这里......
.navlist {
list-style: none;
}
.navlist a {
border-left-color: #555555;
border-left-style: solid;
border-left-width: 0px;
color: #c4c4c4;
}
.navlist a:hover {
border-left-color: #555555;
border-left-style: solid;
color: #555555;
}
答案 0 :(得分:0)
在.navlist a:visited
和.navlist a
之间添加.navlist a:hover
声明,将文字颜色设置为#c4c4c4。