Question

我使用了来自Click here的CSS动画fadeInLeft但是我已经注意到了，因为我已经将jQuery添加到了转换中。

$('#one').click(function(){
    $('#two-bck').removeClass('animated');
    $('#three-bck').removeClass('animated');
    $('#four-bck').removeClass('animated');
    $('#one-bck').addClass('animated');
});

click here to see the full code

即使我添加了前缀，转换也无法在Firefox中运行。有谁知道如何解决这个问题？

Answer 1

你的animate.css中的代码是以某种方式关闭的，我只是用完全缩小版本的animate.css替换你的动画CSS并且嘿presto它的工作原理。 http://jsfiddle.net/kJ2UA/14/

您可以仅使用fadeInLeft动画创建自定义版本，如果您不想包含完整的样式表，则可以在页面上包含该版本。

另外，你应该稍微清理你的jQuery（关于主题），例如：

$(document).ready(function(){
    $('.proBtn').on('click', function(){
        $('li').removeClass('active');
        $('li a').removeClass('blue');
        // Remove anything previously animated
        $('.animated').removeClass('animated');
        // Use current ID to select appropriate box
        $('#' + $(this).attr('id') + '-bck').addClass('animated');
        $(this).parent("li").addClass('active');
        $(this).addClass('blue');
    });
});

CSS动画无法在Firefox中运行

1 个答案: