date. 2015/3/19

category. HTML・CSS JavaScript

Velocity.jsを使用してjQueryでanimationを軽快に行う方法です。

Velocity.jsとは

Velocity.jsはjQueryのanimationの記述と同じ方法で、
CSS3のanimationを利用したanimationなどを利用できます。

使用方法

HTMLでjQuery・Velocity.jsを読み込みます。

<script src="js/jquery.js"></script>
<script src="js/jquery.velocity.js"></script>

JavascriptではjQueryのanimationと同じような方法で、記述します。

$("div").velocity({
  "opacity": 0,
  scaleX: 0.9,
  scaleY: 0.9
, {
  duration: 300,
  complete: function(){console.log("complete");}
});

 

参考サイト

関連記事