Question

还有其他人遇到过这个问题吗？我有一个Web表单站点，我想在一个链接按钮上添加一个：active伪类，基本上是在做一些动作之前为它设置动画。但是，由于某些原因，我无法弄清楚，动态状态有时会阻止回发（其他时候回发就好了）。其他效果（即非动画或变换）工作得很好。所以，这很好，每次都可以：

.mylinkbuttonclass:active
{
    width:75%;
}

以下内容仅在40-50％的时间内导致回发。其他时候根本没有回发（我在页面加载中放置了断点并且预先发现了永远不会被击中的事件）

.mylinkbuttonclass:active
{
    animation: flip 200ms linear 1;
    -moz-animation: flip 200ms linear 1;
    -o-animation: flip 200ms linear 1;
    -ms-animation: flip 200ms linear 1;
    -webkit-animation: flip 200ms linear 1;  
}

@keyframes flip{
    0% {
       transform:  rotateY(0deg);
    }
    50% 
    {
        opacity: 0.10;
        transform:  rotateY(180deg); 
    }
    100% {
       transform:  rotateY(180deg); 
    }
}

有谁知道为什么会这样，或者如何修复它？我不认为伪类有可能阻止回发！在回发失败的时候，动画仍然运行得很好;没有回发到服务器。

编辑：Haven`t已在Firefox上测试过，但Chrome和IE 11上的失败都是可重复的。

Edit2：哇所以这在Firefox中确实很有用;它是Chrome和IE的问题。

Answer 1

由于我在这个时间上有点短暂，我最终只需将按钮上的链接按钮类更改为包含动画的新类。它在所有3个主流浏览器上都有100％的工作时间，但我很想知道是否有人知道它为什么不能与：active selector

一起工作

：带有动画的活动伪类有时会阻止Chrome和IE中的回发

1 个答案: