Question

我在使用css和jquery进行悬停时使用模糊效果。当您将鼠标悬停在其中一段文本上时，css的某些部分将使用jquery应用于兄弟姐妹。如果您查看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

如何使链接文本表现为正常文本？

1 个答案: