如何防止CSS伪元素在动画过程中消失?

Dan*_*iel 6 html javascript css jquery

这是我的(简化)情况:

http://jsfiddle.net/qFhaq/

单击该按钮可启动一个动画,可扩展div的高度.当div正在扩展时,:after伪元素(包含文本"look")消失,然后在动画结束时重新出现.

有没有办法防止伪元素消失,以便它在整个动画中可见?

alj*_*n82 13

将"溢出"CSS规则添加到#main并将其设置为"visible!important;"

#main{
    width: 200px;
    height: 200px;
    background-color: #eee;
    border: 1px solid black;
    overflow:visible !important;
}
Run Code Online (Sandbox Code Playgroud)

  • jQuery在动画时为元素添加内联样式"overflow:hidden".:after元素存在于其父元素(#main)之外,它将被隐藏.所以我们只需添加"overflow:visible!important;" 到css覆盖jQuery添加的内联样式. (2认同)