funnyText.js

JavaScript

垂直・水平方向に文字が移動するアニメーションを実装できるjQueryプラグイン「funnyText.js」

funnyText.jsというjQueryプラグインを使えば、垂直や水平方向に文字が移動するアニメーションを実装することができます。見ていておもしろいアニメーションですね。ちょっとした導線づくりによさそうな感じです。以下は使い方です。

[ads_center]

funnyText.jsの使い方

funnyText.js

funnyText.js

各文字が次々に垂直・水平方向にアニメーションしていきます。アニメーションは、オプションでスピードやフォントサイズ、カラーなんかを設定することもできます。

使い方は、jQuery本体とプラグインを読み込みます。

<link rel="stylesheet" type="text/css" href="jquery.funnyText.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.funnyText.js"></script>

アニメーションを適用したい要素を記述します。

<div class="mySelector">sample text</div>

あとはプラグインをセットするだけです。

$(document).ready(function() {
    $('.mySelector').funnyText();
});

テキストにちょっとしたアニメーションをつけたい時に便利ですね。

軽量で嬉しい!画像を拡大ズームしてくれるjQueryプラグイン「Leroy Zoom」前のページ

jQueryプラグインでレスポンシブ対応のズーム機能付イメージビューア「Smoothproducts」次のページ

関連記事

  1. Swipe-Li

    JavaScript

    スマホ操作に最適!左右のスワイプで有効・無効を選べるjQueryプラグイン「Swipe-Li」

    Swipe-LiというjQueryプラグインを使えば、左右のスワイプで…

  2. Sticky Multi Header Scroll
  3. JavaScript

    画像にマウスオーバーするとズームして綺麗にエフェクトがかかるjQueryプラグイン「Swish」

    画像にマウスオーバーをするとズームして綺麗なオーバーレイのエフェクトが…

  4. jQuery Quick Modal
  5. WD_ImageStax

    JavaScript

    山積みされた写真をシャッフルさせるフォトギャラリー「WD_ImageStax」

    WD_ImageStaxは無造作に山積みされた写真をシャッフルさせるフ…

  6. JavaScript

    文字の半分をスタイルすることができるjQueryプラグイン「Splitchar」

    SplitcharというjQueryプラグインを使えば、文字の半分をス…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. スタバ ドリップコーヒー
  2. エチオピア
  3. 紗々 飴色和栗
  4. DCG-CA21
  5. Apple WatchでのMacロック解除を無効

アーカイブ

PAGE TOP