jQuery 插件：jAnimate

jopen 10年前發布 | 11K 次閱讀 jAnimate jQuery Ajax框架

jAnimate 是一款幫助你在 jQuery 中使用 Animate.css 的插件。如果你想立刻中止動畫效果，且保持該狀態不變的話，推薦使用 jAnimate 。

示例： 

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <title>janimate example</title>
  <link rel="stylesheet" >
</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>

項目主頁：http://www.baiduhome.net/lib/view/home/1428909597799

 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！