「ページ読み込んでちょっとスクロールさせたらこれが出てくる」「読み込んで2秒くらいしたらここがどーんとなる」とか「まあそんなあんまり本気なつもりじゃないんだけどーあるとなんか嬉しいっていうかー」的なサイト上の演出を、とっても簡単に話振られたりしませんか? 私はよく振られます。都度それらしいアニメーション専用のプラグイン入れるのも大仰だし、でも都度都度CSSだのJSだののアニメーションを書くのも疲れたので、この際jQueryのプラグインにまとめてみました。
なお、動作しているのはこちらです。
至ってシンプルに、指定のタイミングが来たら、やはり指定されたCSS transitionが動くというそれだけのシロモノです。HTML側で概ね制御できますので、調整などもそれなりに簡単に行なえます。でもやっぱり複雑なことをさせたいよ、てな場合は、指定のタイミングで任意のクラス名が付与されるという(だけの)仕組みですので、CSSに書いちゃうのがいいと思います。
折があれば複数のトランジションが指定できるようにしようとか思いますが、それはまあまたいずれ。