css动画

1.css动画animation属性:http://www.w3school.com.cn/cssref/pr_animation.asp

2.Animate.css效果和文件:http://www.dowebok.com/demo/2014/98/

先找相应动画效果,在查看源码

3.github可以增加一个函数:https://github.com/daneden/animate.css

当-webkit-animation动画结束时有一个webkitAnimationEnd事件,当动画完成后执行

判断

webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend
$.fn.extend({
    animateCss: function (animationName) {
        var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
        this.addClass('animated ' + animationName).one(animationEnd, function() {
            $(this).removeClass('animated ' + animationName);
        });
    }
});

 

posted @ 2016-12-01 14:13  承载梦想-韩旭明  阅读(151)  评论(0编辑  收藏  举报