TypeIt

JavaScript

タイピングアニメーションを実装できる「TypeIt」

TypeItはタイピングアニメーションを実装できるjQueryプラグインです。スピード調節やカーソル表示・非表示などカスタマイズも手軽にできるのが特徴です。ちょっとしたアクセントに使ってみたいですね。

TypeIt

デモ

まるで本当にタイピングしているかのようなアニメーションでテキストが表示されます。自分が入力しているような感覚になるので、テキストに集中しちゃいますね。

サイトの導線づくりにも役立つのではないでしょうか?

使い方もシンプルなのがいいですね。カスタマイズできるオプション設定を、HTMLのタグ内に直接書き込むか、JS側に書き込むかを選べるのも嬉しいところです。

オプションの値を変更するとどのように反映されるのかは、デモページで確認できるので、気になる方はぜひチェックしてみてください。

TypeIt

関連記事

  1. Animated Heat Distortion Effects with WebGL

    JavaScript

    陽炎のような揺れを表現できる「Animated Heat Distortion Effects wi…

    夏の暑い日などによく見かける「陽炎」のようなエフェクトを実装することが…

  2. responsive-flip-pricing-table

    JavaScript

    レスポンシブでフリップによる価格表示の切り替えができる「Responsive Flip Pricin…

    レスポンシブに対応し、フリップによる価格表示の切り替えもできるテーブル…

  3. Slickhover.js

    JavaScript

    滑らかでスムーズなホバーエフェクトを実装できるjQueryプラグイン「Slickhover.js」

    とても軽量で使いやすいのがいいですね。ホバー時に滑らかでスムーズなエフ…

  4. percircle

    JavaScript

    カスタマイズもできるパーセンテージのサークル実装「percircle」

    percircleはCSSによるパーセンテージのサークルを実装できるj…

  5. Lettering.js

    JavaScript

    一文字ずつスタイルなどを調整できるようにしてくれる「Lettering.js」

    Lettering.jsは一文字ずつCSSなどでスタイルを調整できるよ…

最近の記事

  1. カメラマングローブ Grip Hot Shot III
  2. 包(つつむ)巾着ポーチ
  3. KMC-80BK
  4. 味噌ラーメン〜旨辛にんにく味噌〜

Instagram始めました

Facebookページ

PAGE TOP