css - 奇怪的悬停故障 CSS

Question

http://codepen.io/alcoven/pen/KvJae

^ 指向我的 codepen 的链接，当您将鼠标悬停在连击笔划(白色部分)上时，没有任何故障，但是一旦您将鼠标悬停在内部部分上，它就会变得有点古怪。我不知道如何让它顺利。可以的话请帮忙 谢谢! :D

-亚历克斯

Answer 1

我认为您的问题在于，当您将鼠标悬停在内部时，一旦 .innerpre 的宽度达到您的光标，您就会将鼠标悬停在 .innerpre 而不是 .inner 上。

只需将最后一个选择器更改为包含 .innerpre:hover

.inner:hover + .innerpre,
.innerpre:hover {
    width: 224px;
    margin: 117px 0px 0px 153px;
    -webkit-transition: all 1s;
    transition: all 1s;
}