2

我使用了fadeInLeft来自Click here的 CSS 动画，但是自从我将 jQuery 添加到过渡中后，我注意到了这一点。

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

点击这里查看完整代码

即使我添加了前缀，转换在 Firefox 中也不起作用。有谁知道我可以如何解决这个问题？

4

1 回答 1

1

您来自 animate.css 的代码以某种方式关闭，我只是将您的动画 CSS 替换为 animate.css 的完整缩小版本，嘿，它可以工作。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');
    });
});
于 2013-09-23T09:05:53.743 回答