我在这里有一个很好的故障效果,在文本上有一个悬停效果.到目前为止,一切正常,但是当有人使用悬停效果时,我稍加改动即可更改文本.

目前,它会显示出毛刺效果,但仍带有“脉冲”一词.我试图做的是,如果有人将鼠标移到脉搏上,则显示“即将来临”一词.我尝试了：before和：after元素,但是它对我没有用.希望你能帮助我.

的HTML

 <a href="#" target="_blank" class="glitch-btn">
  <div class="label">PULSE</div>
  <div class="mask"><span>Coming soon</span></div>
  <div class="mask"><span>Coming soon</span></div>
  <div class="mask"><span>Coming soon</span></div>
  <div class="mask"><span>Coming soon</span></div>
  <div class="mask"><span>Coming soon</span></div></a>

我创建了一个JS小提琴,因为CSS很长才能在此处发布

js fiddle

解决方法:

.glitch-btn:hover .label {
  opacity: 0 !important;
}