jquery - 如何使链接文本看起来像普通文本一样？

Question

我正在使用 css 和 jquery 在悬停时使用模糊效果。当您将鼠标悬停在其中一段文本上时，CSS 的某些部分会使用 jquery 应用于 sibling 。如果您查看 link “音乐”文本没有超链接，并且在悬停时按我想要的方式运行。但其余部分是链接的，我希望它们在超链接时表现得像“音乐”。

CSS:

.blur {
text-decoration: none;
color: #339;
-webkit-transition: 400ms ease 100ms;
-moz-transition: 400ms ease 100ms;
transition: 400ms ease 100ms;

}  

.textshadow {
text-decoration: none;
color: rgba(0,0,0,0);
outline: 0 none;
-webkit-transition: 400ms ease 100ms;
-moz-transition: 400ms ease 100ms;
transition: 400ms ease 100ms; }  
.out {
text-shadow: 0 0 4px #339;}


a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
opacity:none;
}

Answer 1

$('.blur').hover(function() {
    $(this).siblings().children().addClass('out textshadow');
}, function() {
    $(this).siblings().children().removeClass('out textshadow');
});

Fiddle - 所有文本都带有超链接。

---

或者您可以保留相同的 JS(没有 .children())并编辑 CSS 选择器:

.blur 到 .blur a
.textshadow 到 .textshadow a

Fiddle