「自学哈网」一个HTML5+CSS3 animations的动画效果插件
一个HTML5+CSS3 animations的动画效果插件
具有非常丰富的动画显示效果!
网址:http://daneden.github.io/animate.css/
以后制作html5+css3的动画就变得非常简单啦!
CSS3文件下载地址: https://raw.github.com/daneden/animate.css/master/animate.css
使用方法的说明:https://github.com/daneden/animate.css
链接CSS文件:
<head>
<link rel=”stylesheet” href=”animate.min.css”>
</head>
使用代码:
$(‘#yourElement’).addClass(‘animated bounceOutLeft’);
$(‘#yourElement’).one(‘webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend’, doSomething);
扩展使用方法:
$.fn.extend({
animateCss: function (animationName) {
var animationEnd = ‘webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend’;
$(this).addClass(‘animated ‘ + animationName).one(animationEnd, function() {
$(this).removeClass(‘animated ‘ + animationName);
});
}
});
$(‘#yourElement’).animateCss(‘bounce’);
#yourElement {
-vendor-animation-duration: 3s;
-vendor-animation-delay: 2s;
-vendor-animation-iteration-count: infinite;
}
本站所有资源来源于网络,分享目的仅供大家学习和交流!如若本站内容侵犯了原著者的合法权益,可联系邮箱976157886@qq.com进行删除。
自学哈专注于免费提供最新的分享知识、网络教程、网络技术的资源分享平台,好资源不私藏,大家一起分享!
自学哈网 » 「自学哈网」一个HTML5+CSS3 animations的动画效果插件