jQuery 插件:jAnimate
jopen
9年前
jAnimate 是一款帮助你在 jQuery 中使用 Animate.css 的插件。如果你想立刻中止动画效果,且保持该状态不变的话,推荐使用 jAnimate 。
示例:
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>janimate example</title> <link rel="stylesheet" href="https://cdn.rawgit.com/daneden/animate.css/master/animate.css"> </head> <body> <h1>Hello jAnimate</h1> <button class="e1">swing</button> <button class="e2">shake</button> <button class="e3">fadeOut</button> <button class="e4">fadeIn</button> <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script> <script src="https://cdn.rawgit.com/renatorib/janimate/master/dist/janimate.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.e1').click(function(){ $('h1').jAnimateOnce('swing'); }); $('.e2').click(function(){ $('h1').jAnimateOnce('shake'); }); $('.e3').click(function(){ $('h1').jAnimate('fadeOut'); }); $('.e4').click(function(){ $('h1').jAnimate('fadeIn', function(self, effect){ alert(effect + ' finish'); }); }); }); </script> </body>