ホームページ » ツールキット » Tuesday.cssは今一番ホットなアニメーションライブラリです

    Tuesday.cssは今一番ホットなアニメーションライブラリです

    今ではあなたはすでに精通しているべきです Animate.css として プライマリアニメーションライブラリ ウェブデザイナーの間で.

    しかし、という名前のブロックに新しい子供がいます 火曜日, そしてそれは ウェブアニメーションを無理矢理撮る.

    この新しいライブラリは、フォーマットや実装において大きな違いはありません。しかし火曜日には一握りの 新しいCSSアニメーション そのあなた 他には見つからない.

    これらの新しい効果は もっと微妙に だから彼らは本当に きれいにページに溶け込む. これが 効果の小さなリスト あなたが選ぶことができます:

    • フェード&エキスパンド
    • フェード&縮小
    • スタンプダウン&バウンス
    • 斜めスイング
    • 左/右からドロップイン
    • スカッシュ/ストレッチ
    • ヒンジ

    デモページのこのリストに目を通すと、すべての効果があることがわかります。 一つの共通点:物理学.

    みんなとても感じています 物理学の基本に現実的, そして彼らは 重力の法則に従う. これらのアニメーションのどれもが頭の上や余分なものではありません。彼らは 微妙だが目立つ そしてもっと重要なことに、彼らは 信じられる.

    火曜日は現代の最高のCSSアニメーションライブラリの1つだと思います。 Webアニメーションの現実的な見方.

    私たちは痛い親指のように際立っている狂ったインターフェース効果をデザインするべきではありません. 微妙な それはゲームの名前です 対話型の感覚を作り出す クリックかスクロールかにかかわらず、任意のユーザー入力から.

    問題は常にこれらのアニメーションを一から書き、それを正しく見せることでした。しかし今火曜日にあなたの心配はドアの外に飛び出すことができます.

    ただ GitHubからコピーをダウンロードする そして を追加 .CSS あなたのページにファイルする. あなたは実際にできます GitHubから直接CDNバージョンを使用する ローカルで何もダウンロードしたくない場合.

    これがあなたのWebページに追加されたら、ただ 追加する .アニメート 独自のクラスのいずれかと一緒にクラス GitHubレポジトリにリストされています。あなたのコードは次のようになります。

     

    火曜日です.

    を見てください。 完全な文書 見る すべての入出力アニメーションクラスのリスト.

    JavaScriptを使用している場合は、 これらのクラスを動的に追加する クリック/ホバーイベントこの方法では、ユーザーがボタンをクリックしたときにのみアニメートクラスを追加できます。.

    火曜日にできることはたくさんありますが、実際に実用的なUIアニメーション用の新しいAnimate.cssです。.

    でのぞき見をする デモページ それが実際に動いているのを見るために、そしてあなたは彼らを通して読むことによってもっと学ぶことができます “進行中の” 役職 Shakrチームが火曜日に作成した方法について話しています.