在悬停时使用CSS和jQuery模糊文本

Question

如何在悬停时使用css类和jquery使文本模糊.

<p>Text</p>

在悬停它应该变成blured

Answer 1

如果你想要一个纯CSS解决方案,你可以使用CSS欺骗它 text-shadow

Demo

p:hover {
   color: transparent;
   text-shadow: 0 0 2px rgba(0,0,0,0.7);
}

在这里,我使用了alpha代表的rgba地方,这只不过是不透明......如果你想平滑悬停的效果,请使用CSS 属性.atransition

p {
    -webkit-transition: all .5s;
    transition: all .5s;
}

p:hover {
   color: transparent;
   text-shadow: 0 0 2px rgba(0,0,0,0.7);
}

Demo 2