• Tweet
• 

• Tweet
• 

画像毎にプロパティを設定することで、アニメーションを実現するプラグインです。
ダウンロードはgithubから

デモ

デモはこちら

githubにコードを置いています。

ドキュメント準備中ですが、ざっくりこんな感じ。

// how to use //
////////////////////////////////
// ANIMATION CONFIG (example) //
////////////////////////////////
// var browserW = document.documentElement.clientWidth;  // if you need it.
// var centerW = browserW/2;                             // if you need it.
/**
 * [jQuery animation setting]
 * @type {Object}
 *
 * startinit   : Setting for position of elements before each elements process animation
 * startAnime  : Setting for fadeIn animation
 * finishAnime : Setting for fadeOut animation
 */

var exampleSetting = {
  "ex1" : {
    startAnime : {
      delay   : 0,
      opacity : 'show',
      duration: 1000,
      easing  : "swing"
    },
    finishAnime : {
      delay   : 0,
      opacity : 'hide',
      duration: 600,
      easing  : "swing",
      nextsecne: "#scene2"
    }
  },
  "ex2" : {
    startinit : {
      top    : 125,
      left   : centerW + 700,
      width  : "110%",
      height : "110%"
    },
    startAnime : {
      delay   : 300,
      opacity : 'show',
      top     : 105,
      left    : centerW-20,
      width   : "100%",
      height  : "100%",
      duration: 300,
      easing  : "swing"
    },
    finishAnime : {
      delay   : 500,
      opacity : 'hide',
      left    : centerW-200,
      width   : "80%",
      height  : "80%",
      duration: 400,
      easing  : "easeOutQuart",
      nextsecne: "#scene1"
    }
  }
};
$("#scene1").makeanime(animeSetting);