kissui.scrollanim

JavaScript

スクロールによる多彩なアニメーションを実装できる「kissui.scrollanim」

kissui.scrollanimは、CSS3を活用したスクロールによる多彩なアニメーションを実装できるライブラリです。スクロールすることでフェードで表示・非表示したり、バウンスしたりとさまざまなアニメーションを加えることができます。特定の要素に動きをつけて、注目させたいときなんかに活用してみてはいかがでしょうか。

kissui.scrollanim

デモ

スクロールしていくと、テキストがフェードで表示されたり、バウンスで表示されたり、無限にアニメーションがリピートされたりと、さまざまなアニメーションを実装できます。

イベントごとに好きなアニメーションを設定できるので、好みにあわせてカスタマイズして使いたい人にもピッタリです。具体的なイベントには、in、out、middle、center、top、bottom、left、rightといったものが用意されています。

アニメーションには、バウンス、シェイク、スウィング、フェード、フリップ、回転、ズーム、スライドなど豊富な項目があり、フェード一つとっても、fadeIn、fadeInDownBig、fadeInLeft……と、かなり細かい動きにも対応できるかと思います。

イベントとアニメーションを組み合わせることで、多彩なバリエーションを楽しめそうですね。

kissui.scrollanim

プレーンテキストでペーストEvernoteのペースト時にリッチテキストではなくプレーンテキスト(スタイルなし)にする方法前のページ

軽量で依存しないピュアJavaScriptライブラリによるズーミング実装「Lightense Images」次のページLightense Images

関連記事

  1. cascadingDivs
  2. Water Wave Effect jQuery
  3. multi.js

    JavaScript

    検索機能がついたセレクトボックスを実装できる「multi.js」

    multi.jsは検索機能がついた使いやすいユーザーフレンドリーなセレ…

  4. jQuery Pit-scheduler v2.0
  5. tingle.js

    JavaScript

    シンプルで手軽に実装できるモーダルウィンドウ「tingle.js」

    tingle.jsは、シンプルなモーダルウィンドウを実装できるスクリプ…

  6. Protip

    JavaScript

    カスタマイズ性抜群のツールチップを実装できる「Protip」

    Protipはカスタマイズ性が抜群のツールチップを実装することができる…

最近の記事

  1. ハムエッグホットサンドとドリップコーヒー
  2. 高輪ゲートウェイ駅のスタバ
  3. 新幹線
  4. リッチモンドホテル
  5. ハーブバターチキン 石窯フィローネとドリップコーヒー

アーカイブ

PAGE TOP