テキストのエフェクトがかっこいいjQueryプラグイン texteffects.js

テキストのエフェクトがかっこいいjQueryプラグイン texteffects.jsを使ってみた。

http://fourdesire.com/playgrounds/texteffects

設置は非常に簡単で

JS


$(function(){
	$(".test1").textEffect();
	$(".test2").textEffectLoop();
});

1

2

3

4

$(function(){

$(".test1").textEffect();

$(".test2").textEffectLoop();

});

HTML


&lt;p class="test1"&gt;
    スタンダードな関数です。1度だけ再生されます
&lt;/p&gt;
&lt;ul class="test2"&gt;
    &lt;li&gt;スタンダードな関数が、ループし続けます&lt;/li&gt;
    &lt;li&gt;liタグで複数指定します&lt;/li&gt;
    &lt;li&gt;liタグの数だけループし、最後までいくとまた最初から再生します&lt;/li&gt;
&lt;/ul&gt;

1

2

3

4

5

6

7

8

スタンダードな関数です。1度だけ再生されます

</p>

<li>スタンダードな関数が、ループし続けます</li>

<li>liタグで複数指定します</li>

<li>liタグの数だけループし、最後までいくとまた最初から再生します</li>

</ul>

関数はtextEffect()とtextEffectLoop()の2つだけで

前者が1度だけ、後者はループする。

パラメータは主に以下が利用できる。

textEffect()

fps: フレームごとのマイクロ秒
repeat: 指定した文字がでる前に出るその他文字の数
debug: デバッグモード
reverse: trueで逆エフェクト
possibleChar: 使用する文字。例：”ABCDEFGHIJKLMNOPQRSTUVWXYZ~!@#$%^&*()_+-=[];;><0123456789″

textEffectLoop()

timeout: エフェクト開始から終了までのマイクロ秒
loop: 何回ループさせるか

EC jQuery jQueryプラグイン役員

WRITER

hoshino

ECのことを中心に書きたいと思います。ネタが無いときはプログラムやデザインのことも書きます。

この著者の記事を見る

PREVキュレーション型ECサイト NEXTデータベースバックアップと復元

テキストのエフェクトがかっこいいjQueryプラグイン texteffects.js

Related