jquery-bubble-text - テキストアニメーションのjQueryプラグイン // MOONGIFT Archived

アニメーションはただ静的に書かれているのに対して何倍も見た目のインパクトがあります。ともすると見逃されてしまいがちなテキストもアニメーションすることによってユーザに見てもらえるようになります。そんなアニメーション、特にテキストを動かしてくれるライブラリがjquery-bubble-textです。

jquery-bubble-textの使い方

jquery-bubble-textの基本的な使い方です。jQueryプラグインなので使い方が簡単です。

var properties = {
    element: $element,
    newText: 'new Text',
};
bubbleText(properties);

動いているところです。文字が書かれた後、動的に幅が調整されているのが分かります。

さらに同じ行の中で文字がダイナミックに変化するバージョンもあります。

jquery-bubble-textを使うとアニメーションGIFで作るようなテキストアニメーションが簡単に作成できます。テキストだけなのでアニメーションも軽いのが利点です。多用は禁物ですが、最初の表示に使ったりするとインパクトがありそうです。

jquery-bubble-textはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。