首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >如何使用jQuery使文本链接具有动画效果?

如何使用jQuery使文本链接具有动画效果?
EN

Stack Overflow用户
提问于 2010-03-31 06:24:18
回答 1查看 690关注 0票数 1

我对jQuery有些陌生,我在尝试实现一些东西时遇到了问题。

我有一个垂直导航菜单,通过更改颜色、增加字母间距和在左侧添加边框,每个链接在悬停时都会显示动画。

一切都按我想要的方式运行,除了我点击链接的时候。单击链接后,文本将更改为不同的颜色,并保持相同的颜色,即使我将鼠标悬停在该链接上也是如此。

我想让它的颜色变化悬停保持完好无损,即使我点击链接。我确信我错过了一些简单的东西,但我已经尝试了我所知道的一切,但没有运气。任何建议都会很有帮助!

这是我为这个动画准备的。

代码语言:javascript
代码运行次数:0
运行
复制
<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在这里...

代码语言:javascript
代码运行次数:0
运行
复制
.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;
}
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2010-03-31 06:27:07

.navlist a.navlist a:hover之间添加一个.navlist a:visited声明,将文本颜色设置为#c4c4c4。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2549159

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档